/* =========================================================
BIG VALPO BLUES — TIENDA / CATÁLOGO
========================================================= */
:root{
–paper:#e9e0d0;
–paper2:#ddd1bd;
–ink:#171615;
–muted:#665f55;
–rust:#a64d27;
–blue:#244c55;
–dark:#111312;
–line:#b9aa93;
–white:#f7f2e8;
}
*{
box-sizing:border-box;
}
html{
scroll-behavior:smooth;
}
body{
margin:0;
background:var(–paper);
color:var(–ink);
font-family:
Arial,
Helvetica,
sans-serif;
line-height:1.65;
}
img{
display:block;
width:100%;
}
a{
color:inherit;
text-decoration:none;
}
.wrap{
width:min(1280px,92%);
margin:auto;
}
/* =========================================================
TOP BAR
========================================================= */
.topbar{
display:flex;
justify-content:space-between;
align-items:center;
padding:24px 4%;
background:var(–paper);
border-bottom:
1px solid rgba(0,0,0,.18);
position:relative;
z-index:10;
}
.brand{
font-family:Georgia,serif;
font-size:1.15rem;
font-weight:bold;
letter-spacing:.08em;
text-transform:uppercase;
}
.topnav{
display:flex;
gap:28px;
font-size:.82rem;
text-transform:uppercase;
letter-spacing:.12em;
}
.topnav a{
opacity:.72;
}
.topnav a:hover{
opacity:1;
}
/* =========================================================
HERO
========================================================= */
.hero{
min-height:88vh;
display:grid;
grid-template-columns:
42% 58%;
border-bottom:
1px solid var(–line);
}
.hero-copy{
display:flex;
flex-direction:column;
justify-content:center;
padding:
70px 8% 70px 10%;
}
.kicker{
color:var(–rust);
text-transform:uppercase;
font-size:.76rem;
letter-spacing:.23em;
font-weight:bold;
margin-bottom:22px;
}
.hero h1{
margin:0 0 30px;
font-family:
Georgia,
“Times New Roman”,
serif;
font-weight:normal;
font-size:
clamp(4rem,7vw,7.8rem);
line-height:.83;
letter-spacing:-.055em;
}
.hero h1 span{
display:block;
font-style:italic;
color:var(–blue);
}
.hero-copy p{
max-width:520px;
color:var(–muted);
font-size:1.12rem;
margin-bottom:34px;
}
.hero-image{
min-height:700px;
background:
url(“images/hero-tienda-big-valpo-blues.png”)
center/cover no-repeat;
}
/* =========================================================
BUTTONS
========================================================= */
.text-link{
display:inline-flex;
align-items:center;
gap:12px;
width:max-content;
padding-bottom:5px;
border-bottom:
1px solid var(–ink);
text-transform:uppercase;
letter-spacing:.12em;
font-size:.76rem;
font-weight:bold;
}
.text-link::after{
content:”→”;
transition:.2s;
}
.text-link:hover::after{
transform:translateX(6px);
}
/* =========================================================
INTRO MANIFESTO
========================================================= */
.manifesto{
padding:
120px 0 115px;
}
.manifesto-grid{
display:grid;
grid-template-columns:
28% 72%;
gap:50px;
}
.number{
font-family:Georgia,serif;
font-size:
clamp(4rem,9vw,9rem);
color:var(–rust);
opacity:.85;
line-height:.8;
}
.manifesto h2{
font-family:
Georgia,
“Times New Roman”,
serif;
font-size:
clamp(2.8rem,5vw,5.7rem);
line-height:.98;
font-weight:normal;
margin:
0 0 32px;
max-width:900px;
}
.manifesto h2 em{
color:var(–blue);
font-weight:normal;
}
.manifesto p{
color:var(–muted);
font-size:1.15rem;
max-width:730px;
}
/* =========================================================
PRODUCT STORY
========================================================= */
.product-story{
display:grid;
grid-template-columns:
57% 43%;
min-height:690px;
border-top:
1px solid var(–line);
}
.product-story.reverse{
grid-template-columns:
43% 57%;
}
.product-story.reverse .story-image{
order:2;
}
.product-story.reverse .story-copy{
order:1;
}
.story-image img{
width:100%;
height:100%;
min-height:690px;
object-fit:cover;
}
.story-copy{
display:flex;
flex-direction:column;
justify-content:center;
padding:
65px clamp(35px,6vw,95px);
}
.story-index{
font-family:Georgia,serif;
color:var(–rust);
font-size:1rem;
margin-bottom:35px;
}
.story-label{
text-transform:uppercase;
letter-spacing:.2em;
font-size:.72rem;
color:var(–blue);
font-weight:bold;
margin-bottom:12px;
}
.story-copy h2{
font-family:
Georgia,
“Times New Roman”,
serif;
font-size:
clamp(2.8rem,4.8vw,5.3rem);
line-height:.95;
font-weight:normal;
margin:
0 0 25px;
}
.story-copy p{
color:var(–muted);
font-size:1.08rem;
max-width:520px;
}
.price{
margin:
20px 0 26px;
font-family:Georgia,serif;
font-size:1.6rem;
}
/* =========================================================
DARK FEATURE
========================================================= */
.dark-feature{
background:var(–dark);
color:var(–white);
display:grid;
grid-template-columns:
48% 52%;
min-height:760px;
}
.dark-image{
background:
url(“images/radio-amplificador-big-valpo.png”)
center/cover no-repeat;
min-height:760px;
}
.dark-copy{
display:flex;
justify-content:center;
flex-direction:column;
padding:
80px clamp(40px,7vw,110px);
}
.dark-copy .story-label{
color:#d68043;
}
.dark-copy h2{
font-family:
Georgia,
“Times New Roman”,
serif;
font-weight:normal;
font-size:
clamp(3rem,5vw,6rem);
line-height:.92;
margin:
0 0 30px;
}
.dark-copy p{
max-width:560px;
color:#bdb5a7;
font-size:1.08rem;
}
.dark-feature .text-link{
border-color:var(–white);
margin-top:22px;
}
/* =========================================================
SMALL COLLECTION
========================================================= */
.collection{
padding:
120px 0;
}
.collection-head{
display:flex;
justify-content:space-between;
align-items:flex-end;
gap:40px;
margin-bottom:55px;
}
.collection-head h2{
font-family:
Georgia,
“Times New Roman”,
serif;
font-size:
clamp(3rem,5vw,5.5rem);
font-weight:normal;
line-height:.9;
margin:0;
}
.collection-head p{
max-width:400px;
color:var(–muted);
}
.collection-grid{
display:grid;
grid-template-columns:
repeat(3,1fr);
gap:22px;
}
.mini-product{
position:relative;
}
.mini-product img{
aspect-ratio:4 / 5;
object-fit:cover;
filter:saturate(.9);
}
.mini-product-info{
padding-top:18px;
}
.mini-product small{
color:var(–rust);
text-transform:uppercase;
letter-spacing:.15em;
font-weight:bold;
}
.mini-product h3{
font-family:Georgia,serif;
font-weight:normal;
font-size:1.65rem;
margin:
5px 0 4px;
}
.mini-product p{
color:var(–muted);
margin:0;
font-size:.95rem;
}
/* =========================================================
QUOTE / PHILOSOPHY
========================================================= */
.philosophy{
background:var(–blue);
color:var(–white);
padding:
120px 0;
text-align:center;
}
.philosophy blockquote{
margin:auto;
max-width:1000px;
font-family:
Georgia,
“Times New Roman”,
serif;
font-size:
clamp(2.4rem,5vw,5rem);
font-weight:normal;
line-height:1.04;
}
.philosophy span{
display:block;
margin-top:30px;
font-family:Arial,sans-serif;
font-size:.72rem;
text-transform:uppercase;
letter-spacing:.2em;
opacity:.75;
}
/* =========================================================
COMING
========================================================= */
.coming{
padding:
120px 0;
}
.coming-grid{
display:grid;
grid-template-columns:
1fr 1fr;
gap:80px;
}
.coming h2{
font-family:Georgia,serif;
font-size:
clamp(3rem,6vw,6.5rem);
font-weight:normal;
line-height:.87;
margin:0;
}
.coming h2 em{
color:var(–rust);
font-weight:normal;
}
.coming-copy{
align-self:end;
}
.coming p{
color:var(–muted);
font-size:1.1rem;
max-width:530px;
margin-bottom:30px;
}
/* =========================================================
FOOTER
========================================================= */
footer{
background:#0d0e0d;
color:#e9e1d3;
padding:
75px 0 45px;
}
.footer-grid{
display:grid;
grid-template-columns:
2fr 1fr 1fr;
gap:60px;
}
.footer-logo{
font-family:Georgia,serif;
font-size:2.3rem;
line-height:.9;
text-transform:uppercase;
}
.footer-small{
font-size:.78rem;
color:#958d82;
margin-top:22px;
max-width:380px;
}
footer h4{
font-size:.72rem;
letter-spacing:.17em;
text-transform:uppercase;
color:#b76d3f;
margin:
0 0 16px;
}
footer a{
display:block;
margin-bottom:8px;
font-size:.92rem;
color:#cbc4b9;
}
/* =========================================================
MOBILE
========================================================= */
@media(max-width:850px){
.topnav{
display:none;
}
.hero{
grid-template-columns:1fr;
}
.hero-copy{
min-height:60vh;
padding:
75px 8%;
}
.hero-image{
min-height:62vh;
}
.manifesto-grid{
grid-template-columns:1fr;
}
.number{
font-size:4rem;
}
.product-story,
.product-story.reverse{
grid-template-columns:1fr;
}
.product-story.reverse .story-image{
order:1;
}
.product-story.reverse .story-copy{
order:2;
}
.story-image img{
min-height:0;
height:auto;
aspect-ratio:4/3;
}
.story-copy{
padding:
60px 7% 75px;
}
.dark-feature{
grid-template-columns:1fr;
}
.dark-image{
min-height:60vh;
}
.dark-copy{
padding:
70px 7%;
}
.collection-head{
display:block;
}
.collection-head p{
margin-top:25px;
}
.collection-grid{
grid-template-columns:1fr;
gap:50px;
}
.mini-product img{
aspect-ratio:5/4;
}
.coming-grid{
grid-template-columns:1fr;
gap:45px;
}
.footer-grid{
grid-template-columns:1fr;
gap:40px;
}
}
Cosas
para Blues.
Una pequeña colección de objetos,
accesorios, arte y rarezas para quienes
no necesitan demasiadas explicaciones
cuando empieza a sonar una guitarra slide.
No queremos vender de todo.
Queremos encontrar
cosas que tengan alma.
Algunas serán nuevas.
Otras habrán pasado décadas esperando
que alguien las vuelva a enchufar.
Habrá cosas hechas especialmente para nosotros,
pequeños experimentos y objetos que simplemente
nos parecieron demasiado blueseros como para dejarlos pasar.
Slide de
frasco.
Simple y sorprendentemente cómodo.
La tapa genera apoyo para el dedo
y ayuda a mantener el slide firme.
Tiene un sonido con cuerpo,
menos estridente que algunos slides finos
y con un sustain muy agradable.
Poleras que
usaríamos nosotros.
Nada de merchandising corporativo.
Blues, guitarras, juke joints,
carreteras, puerto y diseños
que se vean mejor después de muchos lavados.
Una radio vieja.
Una guitarra.
Otra oportunidad.
Recuperamos radios antiguas
para convertirlas en amplificadores
para guitarra, Cigar Box Guitar
o armónica.
Conservamos las marcas,
perillas, madera y personalidad
que les dejaron los años.
Cada una será diferente.
Esa es precisamente la gracia.
Algunas cosas
más.
La colección irá creciendo lentamente.
Preferimos pocas cosas interesantes
a una tienda llena de cosas que nadie recuerda.
Para la mañana
Tazones Blues
Café, riffs y decisiones
cuestionables antes de las nueve.
Para la pared
Arte & Blues
Láminas y cuadros inspirados
en guitarras, músicos,
carreteras y viejos juke joints.
En desarrollo
Cosas raras
CBG, stompboxes,
armónicas, pickups,
one-man-band gear
y otros experimentos.
“No sabemos todavía
todo lo que venderemos.
Eso también es parte
de la gracia.”
Big Valpo Blues · Valparaíso
Esto recién
empieza.
Estamos buscando, probando,
restaurando y construyendo nuevas cosas.
Vinilos de Blues, Cigar Box Guitars,
armónicas, stompboxes,
pedales, pickups, accesorios
y equipamiento para one-man-band.
Cuando algo nos guste de verdad,
aparecerá aquí.