/*
Theme Name: Gastro Balanz
Theme URI: https://gastrobalanz.com.ar
Author: Gastro Balanz
Description: Tema propio para el sitio de Gastro Balanz, consultoría gastronómica.
Version: 1.0
Text Domain: gastrobalanz
*/

:root{
  --verde: #0f5244;
  --crema: #f7f4eb;
  --negro: #2b2c2c;
  --teal: #487281;
  --marino: #373f51;
  --naranja: #c96610;
}
*{margin:0;padding:0;box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  background:var(--crema);
  color:var(--negro);
  font-family:'Space Grotesk',sans-serif;
  overflow-x:hidden;
}
h1,h2,h3,.serif{font-family:'Fraunces',serif;}
a{color:inherit;text-decoration:none;}

/* ===== equilibrium bar — signature motif ===== */
.fiel{
  position:relative;
  height:2px;
  background:linear-gradient(90deg, transparent, var(--negro) 15%, var(--negro) 85%, transparent);
  opacity:.25;
  margin:0 auto;
  width:min(1100px, 88%);
}
.fiel::after{
  content:'';
  position:absolute;
  top:50%; left:50%;
  width:8px;height:8px;
  background:var(--naranja);
  border-radius:50%;
  transform:translate(-50%,-50%);
  animation:fiel-move 6s ease-in-out infinite;
}
@keyframes fiel-move{
  0%,100%{left:38%;}
  50%{left:62%;}
}

/* ===== nav ===== */
nav{
  position:sticky; top:0; z-index:50;
  display:flex; justify-content:space-between; align-items:center;
  padding:22px 6vw;
  background:rgba(247,244,235,.9);
  backdrop-filter:blur(8px);
  border-bottom:1px solid rgba(43,44,44,.08);
}
.logo-mark{display:flex; align-items:center; gap:10px;}
.logo-mark .wordmark{font-family:'Fraunces',serif; font-size:1.3rem; font-weight:500; color:var(--verde); letter-spacing:.01em;}
.logo-mark .tagline{
  font-size:.58rem; font-weight:600; letter-spacing:.14em;
  color:var(--negro); opacity:.5; text-transform:uppercase;
  border-left:1px solid rgba(43,44,44,.25); padding-left:10px; line-height:1.4;
}
.navlinks{display:flex; gap:34px; font-size:.9rem; font-weight:500;}
.navlinks a{opacity:.75; transition:opacity .2s;}
.navlinks a:hover{opacity:1;}
.nav-cta{
  background:var(--verde); color:var(--crema); padding:10px 20px;
  border-radius:2px; font-size:.85rem; font-weight:600;
}
.nav-toggle{
  display:none; flex-direction:column; justify-content:center; gap:5px;
  width:36px; height:36px; border:none; background:transparent; cursor:pointer; padding:0;
}
.nav-toggle span{width:100%; height:2px; background:var(--negro); transition:transform .2s, opacity .2s;}
.nav-toggle.open span:nth-child(1){transform:translateY(7px) rotate(45deg);}
.nav-toggle.open span:nth-child(2){opacity:0;}
.nav-toggle.open span:nth-child(3){transform:translateY(-7px) rotate(-45deg);}

/* ===== hero ===== */
.hero{
  padding:9vw 6vw 6vw;
  display:grid; grid-template-columns:1.15fr .85fr; gap:60px; align-items:center;
  min-width:0;
}
.hero > *{min-width:0;}
.eyebrow{
  font-size:.78rem; font-weight:600; letter-spacing:.16em; text-transform:uppercase;
  color:var(--naranja); margin-bottom:22px; display:flex; align-items:center; gap:10px;
}
.eyebrow::before{content:'';width:26px;height:1px;background:var(--naranja);}
.hero h1{
  font-size:clamp(2.4rem, 4.4vw, 3.9rem);
  font-weight:500; line-height:1.06; letter-spacing:-.01em;
  color:var(--verde);
}
.hero h1 em{font-style:italic; color:var(--negro);}
.hero p{
  margin-top:26px; font-size:1.08rem; line-height:1.6; opacity:.8; max-width:46ch;
}
.hero-actions{display:flex; gap:16px; margin-top:38px;}
.hero-newsletter{margin-top:28px; padding-top:24px; border-top:1px solid rgba(43,44,44,.12);}
.hero-newsletter-label{display:block; font-size:.82rem; font-weight:600; color:var(--marino); margin-bottom:12px;}
.hero-newsletter form{display:flex; gap:0; max-width:380px;}
.hero-newsletter input[type="email"]{flex:1; padding:12px 14px; border:1px solid rgba(43,44,44,.25); border-right:none; background:var(--crema); font-family:'Space Grotesk',sans-serif; font-size:.85rem;}
.hero-newsletter button{background:var(--naranja); color:var(--crema); border:none; padding:12px 18px; font-weight:600; font-size:.82rem; cursor:pointer; white-space:nowrap;}
.btn-primary{
  background:var(--naranja); color:var(--crema); padding:15px 28px;
  font-weight:600; font-size:.92rem; border-radius:2px;
  transition:transform .2s;
}
.btn-primary:hover{transform:translateY(-2px);}
.btn-ghost{
  border:1px solid var(--negro); padding:15px 28px; font-weight:600; font-size:.92rem;
  border-radius:2px; opacity:.75;
}

/* balance-beam graphic */
.beam-wrap{position:relative; height:420px;}
.beam-svg{width:100%; height:100%;}
.metric-card{
  position:absolute; background:var(--crema); border:1px solid rgba(43,44,44,.12);
  padding:14px 18px; border-radius:3px; font-size:.8rem; box-shadow:0 12px 30px rgba(15,82,68,.12);
}
.metric-card b{display:block; font-family:'Fraunces',serif; font-size:1.5rem; color:var(--verde);}
.m1{top:8%; left:0;}
.m2{bottom:10%; right:2%;}

/* ===== section shell ===== */
section{padding:6vw 6vw;}
.section-head{max-width:640px; margin-bottom:52px;}
.section-head .eyebrow{color:var(--teal);}
.section-head .eyebrow::before{background:var(--teal);}
.section-head h2{font-size:clamp(1.8rem,3vw,2.6rem); font-weight:500; color:var(--negro);}

/* ===== servicios ===== */
.servicios-grid{
  display:grid; grid-template-columns:repeat(3,1fr); gap:1px;
  background:rgba(43,44,44,.14); border:1px solid rgba(43,44,44,.14);
}
.servicio{
  background:var(--crema); padding:38px 32px; min-height:230px;
  display:flex; flex-direction:column; justify-content:space-between;
  transition:background .25s; min-width:0;
}
.servicio:hover{background:#efece0;}
.servicio .num{font-size:.75rem; font-weight:600; opacity:.4; letter-spacing:.1em;}
.servicio h3{font-size:1.2rem; font-weight:500; margin:18px 0 10px; color:var(--verde); min-height:2.9em; display:flex; align-items:flex-end;}
.servicio p{font-size:.88rem; opacity:.72; line-height:1.55;}

/* ===== comunidad grid: foro / bolsa / newsletter ===== */
.comunidad-grid{display:grid; grid-template-columns:1fr 1fr 1fr; gap:1px; background:rgba(43,44,44,.14); border:1px solid rgba(43,44,44,.14);}
.comunidad-card{background:var(--crema); padding:40px 32px; min-width:0;}
.comunidad-card .icon{width:38px;height:38px;border:1px solid var(--negro); border-radius:50%; display:flex; align-items:center; justify-content:center; margin-bottom:22px; font-family:'Fraunces',serif; color:var(--teal);}
.comunidad-card h3{font-size:1.1rem; font-weight:500; margin-bottom:10px;}
.comunidad-card p{font-size:.85rem; opacity:.7; line-height:1.55; margin-bottom:18px;}
.comunidad-card a.link{font-size:.82rem; font-weight:600; color:var(--naranja);}

/* ===== interacción — cuestionario / diagnóstico ===== */
.diagnostico{
  background:var(--crema);
  border:1px solid rgba(43,44,44,.14);
  display:grid; grid-template-columns:1fr 1fr;
  max-width:1100px; margin:0 auto; overflow:hidden;
}
.diag-left{padding:52px 46px; background:var(--marino); color:var(--crema); min-width:0;}
.diag-left .eyebrow{color:var(--naranja);}
.diag-left .eyebrow::before{background:var(--naranja);}
.diag-left h2{font-size:1.9rem; font-weight:500; margin-bottom:16px;}
.diag-left p{opacity:.8; font-size:.92rem; line-height:1.6;}
.diag-list{margin-top:28px; list-style:none;}
.diag-list li{padding:10px 0; border-top:1px solid rgba(247,244,235,.15); font-size:.85rem; opacity:.85;}
.diag-right{padding:52px 46px; display:flex; flex-direction:column; gap:16px; min-width:0;}
  .diag-right form{display:flex; flex-direction:column; gap:16px;}
.diag-right label{font-size:.78rem; font-weight:600; letter-spacing:.05em; text-transform:uppercase; opacity:.6;}
.diag-right input, .diag-right select{
  padding:13px 14px; border:1px solid rgba(43,44,44,.25); background:transparent;
  font-family:'Space Grotesk',sans-serif; font-size:.92rem; border-radius:2px;
}
.diag-submit{
  margin-top:8px; background:var(--naranja); color:var(--crema); border:none;
  padding:15px; font-weight:600; font-size:.9rem; border-radius:2px; cursor:pointer;
}

/* ===== casos de éxito ===== */
.casos{background:var(--verde); color:var(--crema);}
.casos .section-head h2{color:var(--crema);}
.casos .eyebrow{color:var(--naranja);}
.casos .eyebrow::before{background:var(--naranja);}
.casos-scroll{
  display:flex; gap:22px; overflow-x:auto; scroll-snap-type:x mandatory;
  padding-bottom:18px; margin:0 -6vw; padding-left:6vw; padding-right:6vw;
  scrollbar-width:thin; scrollbar-color:rgba(247,244,235,.4) transparent;
}
.casos-scroll::-webkit-scrollbar{height:5px;}
.casos-scroll::-webkit-scrollbar-thumb{background:rgba(247,244,235,.35); border-radius:3px;}
.caso{flex:0 0 300px; scroll-snap-align:start;}
.caso{
  background:rgba(247,244,235,.06); border:1px solid rgba(247,244,235,.16);
  padding:30px 26px; border-radius:4px;
}
.caso .tag{font-size:.72rem; letter-spacing:.1em; text-transform:uppercase; opacity:.6;}
.caso .stat{font-family:'Fraunces',serif; font-size:1.15rem; font-style:italic; color:var(--naranja); margin:14px 0 12px; line-height:1.4;}
.caso p{font-size:.9rem; opacity:.85; line-height:1.55;}

/* ===== newsletter cta ===== */
.newsletter{
  background:var(--negro); color:var(--crema); text-align:center; padding:5vw 6vw;
}
.newsletter h2{font-size:clamp(1.6rem,2.6vw,2.3rem); font-weight:500; margin-bottom:14px;}
.newsletter p{opacity:.65; margin-bottom:30px;}
.nl-form{display:flex; justify-content:center; gap:0; max-width:440px; margin:0 auto;}
.nl-form input{flex:1; padding:15px 16px; border:1px solid rgba(247,244,235,.3); background:transparent; color:var(--crema); font-family:'Space Grotesk',sans-serif;}
.nl-form button{background:var(--naranja); color:var(--crema); border:none; padding:15px 24px; font-weight:600; cursor:pointer;}

footer{padding:4vw 6vw 3vw; display:flex; justify-content:space-between; align-items:flex-end; flex-wrap:wrap; gap:20px;}
.footer-logo img{width:120px; height:auto; display:block;}
.foot-cols{display:flex; gap:60px; font-size:.85rem;}
.foot-cols h4{font-size:.75rem; text-transform:uppercase; letter-spacing:.1em; opacity:.5; margin-bottom:14px;}
.foot-cols a{display:block; opacity:.75; margin-bottom:8px;}

@media (max-width:860px){
  .hero{grid-template-columns:1fr;}
  .servicios-grid, .comunidad-grid{grid-template-columns:1fr;}
  .diagnostico{grid-template-columns:1fr;}
  .navlinks{
    display:none; position:absolute; top:100%; left:0; right:0;
    background:var(--crema); flex-direction:column; gap:0;
    border-bottom:1px solid rgba(43,44,44,.1);
    box-shadow:0 12px 20px rgba(0,0,0,.08);
  }
  .navlinks.open{display:flex;}
  .navlinks a{padding:16px 6vw; border-top:1px solid rgba(43,44,44,.08); opacity:.85;}
  .nav-cta-desktop{display:none;}
  .nav-toggle{display:flex;}
  nav{position:sticky; flex-wrap:wrap;}
}

@media (max-width:520px){
  section{padding:12vw 6vw;}
  .hero{padding:16vw 6vw 10vw;}
  .beam-wrap{height:280px;}
  .metric-card{padding:10px 14px; font-size:.72rem;}
  .metric-card b{font-size:1.2rem;}
  .diag-left, .diag-right{padding:32px 24px;}
  .servicio, .comunidad-card{padding:28px 22px;}
  .hero-actions{flex-direction:column;}
  .hero-newsletter form{flex-direction:column; max-width:100%;}
  .hero-newsletter input[type="email"]{border-right:1px solid rgba(43,44,44,.25); margin-bottom:8px;}
  .btn-primary, .btn-ghost{text-align:center;}
  footer{flex-direction:column; align-items:flex-start;}
  .foot-cols{gap:36px;}
}

/* ===== GastroBlog — listado ===== */
.blog-list{display:flex; flex-direction:column; gap:1px; background:rgba(43,44,44,.14); border:1px solid rgba(43,44,44,.14); max-width:820px;}
.blog-card{display:block; background:var(--crema); padding:28px 32px; text-decoration:none; color:var(--negro); transition:background .2s;}
.blog-card:hover{background:#efece0;}
.blog-card-date{font-size:.72rem; font-weight:600; letter-spacing:.08em; text-transform:uppercase; color:var(--teal); margin-bottom:8px;}
.blog-card h3{font-family:'Fraunces',serif; font-size:1.25rem; font-weight:600; color:var(--verde); margin-bottom:8px;}
.blog-card p{font-size:.9rem; line-height:1.55; opacity:.75; margin-bottom:10px;}
.blog-card-link{font-size:.8rem; font-weight:600; color:var(--naranja);}

/* ===== GastroBlog — entrada individual ===== */
#blog-single{padding:6vw; max-width:760px; margin:0 auto;}
.blog-back{display:inline-block; font-size:.82rem; font-weight:600; color:var(--teal); text-decoration:none; margin-bottom:26px;}
.blog-single-date{font-size:.75rem; font-weight:600; letter-spacing:.08em; text-transform:uppercase; color:var(--naranja); margin-bottom:12px;}
.blog-single-title{font-family:'Fraunces',serif; font-size:clamp(1.7rem,3.4vw,2.4rem); font-weight:600; color:var(--verde); line-height:1.2; margin-bottom:28px;}
.blog-single-content{font-size:1.02rem; line-height:1.75; color:var(--negro);}
.blog-single-content h2{font-family:'Fraunces',serif; font-size:1.3rem; font-weight:600; color:var(--verde); margin:32px 0 12px;}
.blog-single-content h3{font-size:.78rem; font-weight:700; letter-spacing:.06em; text-transform:uppercase; color:var(--marino); margin:24px 0 10px;}
.blog-single-content p{margin-bottom:16px;}
.blog-single-content ul{margin:0 0 16px 20px;}
.blog-single-content li{margin-bottom:6px;}
.blog-single-content strong{color:var(--verde);}
.blog-single-cta{background:var(--marino); padding:24px; border-radius:4px; text-align:center; margin-top:36px;}
.blog-single-cta p{color:var(--crema); margin-bottom:12px;}
.blog-single-cta a{display:inline-block; background:var(--naranja); color:var(--crema); font-weight:600; font-size:.85rem; padding:12px 22px; border-radius:2px; text-decoration:none;}
