:root{
    /* paleta tomada del logo: antifaz naranja, plumas azul/verde/fucsia, perrito cafe */
    --cream:#FDF5E6;
    --cream-2:#F7E9D0;
    --ink:#33200F;
    --ink-2:#4A2C1E;
    --muted:#6B4430;
    --muted-2:#8A6A50;
    --cherry:#DA1470;         /* fucsia de la pluma central */
    --cherry-dark:#B0135A;
    --turquoise:#0B84BC;      /* azul del antifaz */
    --turquoise-dark:#08658F;
    --mustard:#FDB515;        /* naranja-amarillo del antifaz */
    --mustard-dark:#CE8A00;
    --green:#1C9A4E;          /* verde de las plumas */
    --green-dark:#17853F;
    --brown:#B07A55;          /* pelaje del perrito */
    --paper:#FFFDF7;
    --line: rgba(51,32,15,0.14);
    --radius: 22px;
    --radius-sm: 14px;
    --shadow: 0 10px 30px rgba(51,32,15,0.09);
    --shadow-lg: 0 20px 50px rgba(51,32,15,0.15);
    --pad-x: clamp(18px, 5vw, 28px);
    --section-y: clamp(56px, 8vw, 96px);
    --bar-h: 0px;
  }

  *{box-sizing:border-box;}
  html{
    scroll-behavior:smooth;
    scroll-padding-top:84px;              /* el header sticky no tapa las anclas */
    -webkit-text-size-adjust:100%;        /* evita que iOS reescale el texto */
  }
  body{
    margin:0;
    background:var(--cream);
    color:var(--ink);
    font-family:'Karla', sans-serif;
    font-size:16px;
    line-height:1.55;
    overflow-x:hidden;                    /* mata el scroll lateral en celular */
    -webkit-font-smoothing:antialiased;
    -webkit-tap-highlight-color: rgba(226,66,50,0.15);
    padding-bottom: var(--bar-h);
  }
  h1,h2,h3,h4,.display{
    font-family:'Fredoka', sans-serif;
    font-weight:600;
    letter-spacing:-0.01em;
    line-height:1.12;
    margin:0;
    text-wrap:balance;
  }
  p{ text-wrap:pretty; }
  .mono{
    font-family:'IBM Plex Mono', monospace;
    text-transform:uppercase;
    letter-spacing:0.08em;
    font-weight:500;
  }
  a{ color:inherit; }
  img,svg{ display:block; max-width:100%; }
  button{ font-family:inherit; cursor:pointer; }
  ul{ margin:0; padding:0; list-style:none; }

  .wrap{ max-width:1160px; margin:0 auto; padding:0 var(--pad-x); }
  .section{ padding: var(--section-y) 0; }

  /* accesibilidad: foco visible y salto al contenido */
  :focus-visible{ outline:3px solid var(--turquoise); outline-offset:3px; border-radius:6px; }
  .skip{
    position:absolute; left:-9999px; top:0; z-index:200;
    background:var(--ink); color:var(--cream);
    padding:12px 18px; border-radius:0 0 12px 0; font-weight:700;
  }
  .skip:focus{ left:0; }
  .sr-only{
    position:absolute; width:1px; height:1px; padding:0; margin:-1px;
    overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; border:0;
  }

  @media (prefers-reduced-motion: reduce){
    html{ scroll-behavior:auto; }
    *{ animation:none !important; transition:none !important; }
  }

  /* ---------- botones ---------- */
  .btn{
    display:inline-flex; align-items:center; justify-content:center; gap:9px;
    border:none; border-radius:999px;
    padding:14px 24px;
    min-height:48px;                       /* área táctil cómoda */
    font-weight:700; font-size:15px; line-height:1;
    text-decoration:none; white-space:nowrap;
    transition: transform .18s ease, box-shadow .18s ease, background .18s ease;
  }
  .btn svg{ flex:none; }
  .btn-cherry{ background:var(--cherry); color:var(--paper); box-shadow:0 4px 0 var(--cherry-dark); }
  .btn-cherry:hover{ transform:translateY(2px); box-shadow:0 2px 0 var(--cherry-dark); }
  .btn-ink{ background:var(--ink); color:var(--cream); box-shadow:0 4px 0 #00000066; }
  .btn-ink:hover{ transform:translateY(2px); box-shadow:0 2px 0 #00000066; }
  .btn-wa{ background:#25D366; color:#0B3B21; box-shadow:0 4px 0 #128C43; }
  .btn-wa:hover{ transform:translateY(2px); box-shadow:0 2px 0 #128C43; }
  .btn-outline{ background:transparent; border:2px solid var(--ink); color:var(--ink); }
  .btn-outline:hover{ background:var(--ink); color:var(--cream); }
  .btn-block{ width:100%; }

  /* ---------- ticker superior ---------- */
  .ticker{
    background:var(--ink); color:var(--cream);
    overflow:hidden; padding:9px 0;
  }
  .ticker__track{
    display:flex; width:max-content;
    animation: ticker 34s linear infinite;
  }
  .ticker__group{
    display:flex; flex:none;
    font-family:'IBM Plex Mono', monospace;
    font-size:12px; letter-spacing:0.12em; text-transform:uppercase;
  }
  .ticker__group span{ padding:0 22px; color:var(--mustard); white-space:nowrap; }
  @keyframes ticker{ from{transform:translateX(0);} to{transform:translateX(-50%);} }

  /* ---------- header ---------- */
  .site-header{
    position:sticky; top:0; z-index:80;
    background:rgba(251,243,225,0.94);
    backdrop-filter:blur(10px);
    border-bottom:1px solid transparent;
    transition: box-shadow .25s ease, border-color .25s ease;
  }
  .site-header.is-stuck{ border-color:var(--line); box-shadow:0 6px 20px rgba(51,32,15,0.07); }
  .nav{
    display:flex; align-items:center; justify-content:space-between; gap:14px;
    padding:12px var(--pad-x);
    max-width:1160px; margin:0 auto;
  }
  .logo{ display:flex; align-items:center; gap:10px; text-decoration:none; }
  .logo-mark{ width:52px; height:52px; flex:none; object-fit:contain; }
  .logo-mark--lg{ width:72px; height:72px; }
  /* bloque de marca centrado (pie de pagina) */
  .logo--stack{ flex-direction:column; gap:12px; text-align:center; }
  .logo-word{ font-family:'Fredoka',sans-serif; font-size:clamp(18px,4.6vw,22px); font-weight:700; white-space:nowrap; line-height:1; }
  .logo-word em{ font-style:normal; color:var(--cherry); }

  .nav-links{ display:flex; gap:28px; align-items:center; }
  .nav-links a{
    text-decoration:none; font-weight:700; font-size:14.5px;
    position:relative; padding:6px 0;
  }
  .nav-links a::after{
    content:""; position:absolute; left:0; right:0; bottom:0; height:3px;
    background:var(--cherry); border-radius:3px;
    transform:scaleX(0); transform-origin:left; transition:transform .25s ease;
  }
  .nav-links a:hover::after, .nav-links a:focus-visible::after{ transform:scaleX(1); }
  .nav-cta{ display:flex; gap:10px; }

  /* con siete enlaces el menu se aprieta en pantallas medianas */
  @media (max-width:1080px){
    .nav-links{ gap:18px; }
    .nav-links a{ font-size:13.5px; }
  }
  @media (max-width:920px){
    .nav-links{ gap:13px; }
    .nav-links a{ font-size:13px; }
  }

  .burger{
    display:none;
    width:48px; height:48px; border:none; background:transparent;
    align-items:center; justify-content:center; border-radius:12px;
  }

  /* menú móvil (panel real, no un dropdown improvisado) */
  .nav-panel{
    position:fixed; inset:0; z-index:90;
    background:var(--cream);
    padding: calc(18px + env(safe-area-inset-top)) var(--pad-x) calc(24px + env(safe-area-inset-bottom));
    display:flex; flex-direction:column;
    transform:translateX(100%);
    transition:transform .3s cubic-bezier(.4,0,.2,1);
    visibility:hidden;
  }
  body.nav-open .nav-panel{ transform:translateX(0); visibility:visible; }
  body.nav-open{ overflow:hidden; }
  .nav-panel__top{ display:flex; align-items:center; justify-content:space-between; margin-bottom:26px; }
  .nav-panel__close{
    width:48px; height:48px; border:2px solid var(--ink); background:transparent;
    border-radius:50%; display:flex; align-items:center; justify-content:center;
  }
  .nav-panel a.panel-link{
    display:flex; align-items:center; justify-content:space-between;
    font-family:'Fredoka',sans-serif; font-size:26px; font-weight:600;
    text-decoration:none; padding:16px 0; border-bottom:1px solid var(--line);
  }
  .nav-panel a.panel-link::after{ content:"→"; color:var(--cherry); font-size:22px; }
  .nav-panel__actions{ margin-top:auto; padding-top:28px; display:grid; gap:12px; }
  .nav-panel__meta{ margin-top:18px; font-size:13px; color:var(--muted); text-align:center; }

  /* ---------- hero ---------- */
  .hero{
    position:relative; overflow:hidden;
    padding: clamp(34px, 6vw, 68px) 0 clamp(56px, 8vw, 96px);
    background:
      radial-gradient(circle at 12% 18%, rgba(31,173,166,0.13), transparent 42%),
      radial-gradient(circle at 88% 8%, rgba(240,166,58,0.18), transparent 40%),
      var(--cream);
  }
  .hero__grid{
    display:grid; grid-template-columns: 1.05fr 0.95fr;
    gap: clamp(28px, 5vw, 56px); align-items:center;
  }
  .eyebrow{
    display:inline-flex; align-items:center; gap:8px;
    background:var(--ink); color:var(--mustard);
    padding:8px 15px; border-radius:999px;
    font-size:11.5px; margin-bottom:20px; max-width:100%;
  }
  .eyebrow::before{ content:"●"; color:var(--cherry); flex:none; }
  .hero h1{
    font-size:clamp(34px, 8.4vw, 68px);
    line-height:1.02;
  }
  .hero h1 .swirl{ color:var(--cherry); display:inline-block; }
  .hero .lede{
    font-size:clamp(16px, 2.1vw, 18.5px); line-height:1.6;
    max-width:52ch; margin-top:20px; color:var(--muted);
  }
  .hero__cta{ display:flex; gap:12px; margin-top:28px; flex-wrap:wrap; }
  .hero__cta .btn{ flex:1 1 auto; min-width:190px; }
  .hero__note{
    display:flex; align-items:center; gap:8px;
    margin-top:16px; font-size:13.5px; color:var(--muted);
  }
  .hero__note svg{ flex:none; }
  .hero__stats{
    display:grid; grid-template-columns:repeat(3,1fr);
    gap:16px; margin-top:36px;
    border-top:1px dashed var(--line); padding-top:24px;
  }
  .stat b{ font-family:'Fredoka',sans-serif; font-size:clamp(24px,4.4vw,32px); display:block; color:var(--cherry-dark); line-height:1.1; }
  .stat span{ font-size:12.5px; color:var(--muted); display:block; margin-top:4px; }

  /* carpa del hero: el elemento firma */
  .tent{
    position:relative;
    background:var(--paper);
    border-radius:24px;
    box-shadow:var(--shadow-lg);
    overflow:hidden;
    border:1px solid var(--line);
  }
  .tent__awning{
    height:52px;
    background: repeating-linear-gradient(90deg, var(--cherry) 0 44px, var(--cream-2) 44px 88px);
    -webkit-mask: radial-gradient(circle at 22px 52px, transparent 21px, #000 21.5px) bottom/44px 52px repeat-x;
    mask: radial-gradient(circle at 22px 52px, transparent 21px, #000 21.5px) bottom/44px 52px repeat-x;
  }
  .tent__body{ padding:22px; display:grid; grid-template-columns:1fr 1fr; gap:12px; }
  .tent-item{
    background:var(--cream); border-radius:16px; padding:16px 14px;
    border:1px solid var(--line);
    display:flex; flex-direction:column; align-items:flex-start; gap:10px;
    transition: transform .25s ease;
  }
  .tent-item:hover{ transform:translateY(-4px); }
  .tent-item svg{ width:42px; height:42px; }
  .tent-item b{ font-family:'Fredoka',sans-serif; font-size:15px; font-weight:600; }
  .tent__foot{
    background:var(--ink); color:var(--cream);
    padding:14px 22px; font-size:12.5px;
    display:flex; align-items:center; gap:8px; justify-content:center; text-align:center;
  }
  .tent__foot b{ color:var(--mustard); }

  /* ---------- barra de garantías ---------- */
  .trust{ background:var(--ink); color:var(--cream); padding:20px 0; }
  .trust__grid{
    display:grid; grid-template-columns:repeat(4,1fr); gap:16px;
  }
  .trust-item{ display:flex; align-items:center; gap:10px; font-size:13.5px; line-height:1.35; }
  .trust-item svg{ flex:none; }

  /* ---------- separador festonado ---------- */
  .scallop{ height:30px; width:100%; }
  .scallop--paper{ background: radial-gradient(circle at 16px 0, transparent 15.5px, var(--paper) 16px) top/32px 30px repeat-x; }
  .scallop--cream{ background: radial-gradient(circle at 16px 0, transparent 15.5px, var(--cream) 16px) top/32px 30px repeat-x; }
  .scallop--cherry{ background: radial-gradient(circle at 16px 0, transparent 15.5px, var(--cherry) 16px) top/32px 30px repeat-x; }

  /* ---------- encabezado de sección ---------- */
  .section-head{
    display:flex; justify-content:space-between; align-items:flex-end;
    gap:20px; margin-bottom: clamp(30px, 4vw, 52px); flex-wrap:wrap;
  }
  .kicker{ font-size:12px; color:var(--turquoise-dark); margin-bottom:10px; display:block; }
  .section-head h2{ font-size:clamp(27px, 5.2vw, 44px); max-width:16ch; }
  .section-head p{ max-width:38ch; color:var(--muted); font-size:15px; }

  /* ---------- puestos / menú ---------- */
  .menu{ background:var(--paper); }
  .menu-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:20px; }
  .stall{
    background:var(--cream);
    border-radius:0 0 var(--radius) var(--radius);
    border:1px solid var(--line); border-top:none;
    overflow:hidden;
    transition: transform .25s ease, box-shadow .25s ease;
  }
  .stall:hover{ transform:translateY(-6px); box-shadow:var(--shadow); }
  .stall__roof{ height:10px; background:var(--stall-color); }
  .stall__awning{
    height:24px;
    background:var(--stall-color);
    -webkit-mask: radial-gradient(circle at 12px 24px, transparent 11.5px, #000 12px) bottom/24px 24px repeat-x;
    mask: radial-gradient(circle at 12px 24px, transparent 11.5px, #000 12px) bottom/24px 24px repeat-x;
  }
  .stall__body{ padding:26px 22px 24px; }
  .stall--cherry{ --stall-color:var(--cherry); }
  .stall--mustard{ --stall-color:var(--mustard); }
  .stall--turquoise{ --stall-color:var(--turquoise); }
  .stall--ink{ --stall-color:var(--ink); }
  .stall--green{ --stall-color:var(--green); }
  .stall__icon{ width:54px; height:54px; margin-bottom:16px; }
  .stall h3{ font-size:20px; margin-bottom:8px; }
  .stall p{ font-size:14.5px; color:var(--muted); margin:0 0 18px; }
  .stall__tag{
    display:block; font-size:11.5px; color:var(--ink);
    border-top:1px dashed var(--line); padding-top:14px;
  }

  /* ---------- cómo funciona ---------- */
  .how{ background:var(--cream); }
  .steps{ display:grid; grid-template-columns:repeat(4,1fr); gap:26px; position:relative; }
  .steps::before{
    content:""; position:absolute; top:26px; left:8%; right:8%; height:3px;
    background-image:linear-gradient(90deg, var(--ink) 0 10px, transparent 10px 18px);
    background-size:18px 3px; opacity:.3;
  }
  .step{ position:relative; }
  .step__num{
    width:54px; height:54px; border-radius:50%;
    display:flex; align-items:center; justify-content:center;
    font-family:'Fredoka',sans-serif; font-weight:700; font-size:20px;
    margin-bottom:16px; position:relative; z-index:2; flex:none;
    border:3px solid var(--ink);
  }
  .step:nth-child(1) .step__num{ background:var(--cherry); color:var(--paper); border-color:var(--cherry-dark); }
  .step:nth-child(2) .step__num{ background:var(--mustard); color:var(--ink); border-color:var(--mustard-dark); }
  .step:nth-child(3) .step__num{ background:var(--turquoise); color:var(--paper); border-color:var(--turquoise-dark); }
  .step:nth-child(4) .step__num{ background:var(--ink); color:var(--cream); }
  .step h3{ font-size:17px; margin-bottom:8px; }
  .step p{ font-size:14.5px; color:var(--muted); margin:0; }

  /* ---------- por qué ---------- */
  .why{ background:var(--ink); color:var(--cream); }
  .why .section-head p{ color:#E2D0B4; }
  .why-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:18px; }
  .feature{
    background:var(--ink-2); border-radius:18px; padding:26px 22px;
    border:1px solid rgba(255,255,255,0.08);
  }
  .feature__icon{ width:36px; height:36px; margin-bottom:14px; }
  .feature h3{ font-size:17px; margin-bottom:8px; }
  .feature p{ font-size:14px; color:#D6BFA4; margin:0; }

  /* ---------- combos ---------- */
  .combos{ background:var(--paper); }
  .combo-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:20px; align-items:stretch; }
  .combo{ border-radius:var(--radius); padding:2px; background:linear-gradient(160deg, var(--cherry), var(--mustard)); }
  .combo--mid{ background:linear-gradient(160deg, var(--turquoise), var(--cherry)); box-shadow:var(--shadow); }
  .combo__inner{
    background:var(--cream); border-radius:20px; padding:28px 24px; height:100%;
    display:flex; flex-direction:column;
  }
  .combo__badge{
    align-self:flex-start;
    background:var(--ink); color:var(--mustard);
    font-family:'IBM Plex Mono',monospace; font-size:10.5px; text-transform:uppercase;
    letter-spacing:0.08em; padding:6px 12px; border-radius:999px; margin-bottom:16px;
  }
  .combo--mid .combo__badge{ background:var(--cherry); color:#fff; }
  .combo h3{ font-size:24px; margin-bottom:6px; }
  .combo__price{ font-family:'Fredoka',sans-serif; font-size:14.5px; color:var(--cherry-dark); margin-bottom:18px; }
  .combo ul{ margin:0 0 24px; flex:1; }
  .combo li{
    font-size:14.5px; padding:9px 0 9px 26px; border-top:1px solid var(--line);
    position:relative;
  }
  .combo li::before{
    content:""; position:absolute; left:0; top:15px;
    width:14px; height:8px; border-left:2.5px solid var(--turquoise-dark);
    border-bottom:2.5px solid var(--turquoise-dark); transform:rotate(-45deg);
  }
  .combo li:first-child{ border-top:none; }

  /* ---------- testimonios ---------- */
  .testi{ background:var(--cream); }
  .testi-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:18px; }
  .testi-card{
    background:var(--paper); border-radius:18px; padding:26px;
    border:1px solid var(--line); display:flex; flex-direction:column;
  }
  .testi-card .stars{ color:var(--mustard); font-size:15px; letter-spacing:2px; margin-bottom:12px; }
  .testi-card p{ font-size:14.5px; line-height:1.65; color:#553824; margin:0; flex:1; }
  .testi-card footer{ margin-top:18px; display:flex; align-items:center; gap:10px; }
  .avatar{
    width:38px; height:38px; border-radius:50%; flex:none;
    display:flex; align-items:center; justify-content:center;
    font-family:'Fredoka',sans-serif; font-weight:700; color:var(--paper); font-size:14px;
  }
  .testi-card b{ font-size:13.5px; display:block; }
  .testi-card footer span{ font-size:12px; color:var(--muted-2); }

  /* ---------- preguntas frecuentes ---------- */
  .faq{ background:var(--paper); }
  .faq-list{ max-width:820px; margin:0 auto; }
  .faq-item{
    border:1px solid var(--line); border-radius:var(--radius-sm);
    background:var(--cream); margin-bottom:12px; overflow:hidden;
  }
  .faq-item summary{
    display:flex; align-items:center; justify-content:space-between; gap:16px;
    padding:18px 20px; cursor:pointer; list-style:none;
    font-family:'Fredoka',sans-serif; font-weight:600; font-size:16.5px;
  }
  .faq-item summary::-webkit-details-marker{ display:none; }
  .faq-item summary::after{
    content:"+"; font-size:24px; color:var(--cherry); flex:none; line-height:1;
    transition:transform .25s ease;
  }
  .faq-item[open] summary::after{ transform:rotate(45deg); }
  .faq-item .faq-body{ padding:0 20px 20px; font-size:14.5px; color:var(--muted); }

  /* ---------- contacto ---------- */
  .contact{ background:var(--cherry); color:var(--paper); }
  .contact-grid{ display:grid; grid-template-columns:1fr 1fr; gap: clamp(28px,5vw,60px); align-items:start; }
  .contact h2{ font-size:clamp(27px,5vw,44px); margin-bottom:14px; }
  .contact .lede{ font-size:16px; line-height:1.6; max-width:44ch; color:#FDE0EE; margin:0 0 28px; }
  .contact-info{ display:flex; flex-direction:column; gap:12px; }
  .contact-info a, .contact-info div.info-row{
    text-decoration:none; display:flex; align-items:center; gap:12px;
    font-weight:700; font-size:15.5px; min-height:48px;
  }
  .contact-info .ic{
    width:40px; height:40px; border-radius:50%; background:var(--ink);
    display:flex; align-items:center; justify-content:center; flex:none;
  }
  .contact-form{
    background:var(--paper); color:var(--ink); border-radius:var(--radius);
    padding: clamp(22px, 4vw, 32px); display:flex; flex-direction:column; gap:14px;
    box-shadow:var(--shadow-lg);
  }
  .contact-form h3{ font-size:19px; }
  .contact-form > p.form-intro{ font-size:13.5px; color:var(--muted); margin:-8px 0 4px; }
  .field label{ font-size:12.5px; font-weight:700; display:block; margin-bottom:6px; }
  .field input, .field select, .field textarea{
    width:100%; border:2px solid var(--line); border-radius:12px;
    padding:13px 14px;
    font-family:'Karla',sans-serif;
    font-size:16px;                       /* 16px evita el zoom automático en iOS */
    background:var(--cream); color:var(--ink);
    min-height:50px;
    -webkit-appearance:none; appearance:none;
  }
  .field select{
    background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='9' viewBox='0 0 14 9'%3E%3Cpath d='M1 1l6 6 6-6' stroke='%232B1B12' stroke-width='2' fill='none' stroke-linecap='round'/%3E%3C/svg%3E");
    background-repeat:no-repeat; background-position:right 14px center; padding-right:40px;
  }
  .field textarea{ min-height:92px; resize:vertical; }
  .field input:focus, .field select:focus, .field textarea:focus{
    outline:3px solid var(--turquoise); outline-offset:1px; border-color:var(--turquoise);
  }
  .field-row{ display:grid; grid-template-columns:1fr 1fr; gap:12px; }
  .form-note{ font-size:12.5px; color:var(--muted-2); text-align:center; }
  .form-note.is-ok{ color:var(--turquoise-dark); font-weight:700; }

  /* ---------- footer ---------- */
  .site-footer{ background:var(--ink); color:#D6BFA4; padding:44px 0 30px; }
  .foot-top{
    display:flex; flex-direction:column; align-items:center; text-align:center;
    gap:26px; margin-bottom:30px; padding-bottom:28px;
    border-bottom:1px solid rgba(255,255,255,0.08);
  }
  .foot-links{ justify-content:center; }
  .foot-links{ display:flex; gap:22px; flex-wrap:wrap; }
  .foot-links a{ text-decoration:none; font-size:13.5px; padding:6px 0; }
  .foot-links a:hover{ color:var(--mustard); }
  .foot-bottom{
    display:flex; justify-content:space-between; font-size:12px; color:#8A6E54;
    flex-wrap:wrap; gap:10px;
  }

  /* ---------- barra fija de acción (solo celular) ---------- */
  .action-bar{
    display:none;
    position:fixed; left:0; right:0; bottom:0; z-index:70;
    background:rgba(251,243,225,0.97);
    backdrop-filter:blur(10px);
    border-top:1px solid var(--line);
    padding:10px var(--pad-x) calc(10px + env(safe-area-inset-bottom));
    gap:10px;
    box-shadow:0 -6px 20px rgba(51,32,15,0.08);
  }
  .action-bar .btn{ flex:1; padding:14px 10px; font-size:14.5px; }

  /* botón flotante de WhatsApp (escritorio) */
  .wa-float{
    position:fixed; right:22px; bottom:22px; z-index:60;
    width:58px; height:58px; border-radius:50%;
    background:#25D366; box-shadow:0 8px 24px rgba(18,140,67,0.4);
    display:flex; align-items:center; justify-content:center;
    transition:transform .2s ease;
  }
  .wa-float:hover{ transform:scale(1.07); }

  /* ---------- aparición al hacer scroll ---------- */
  .reveal{ opacity:0; transform:translateY(16px); transition:opacity .6s ease, transform .6s ease; }
  .reveal.in{ opacity:1; transform:translateY(0); }

  /* =========================================================
     RESPONSIVE
     ========================================================= */
  @media (max-width:1024px){
    .menu-grid{ grid-template-columns:repeat(2,1fr); }
    .why-grid{ grid-template-columns:repeat(2,1fr); }
    .steps{ grid-template-columns:repeat(2,1fr); row-gap:34px; }
    .steps::before{ display:none; }
    .trust__grid{ grid-template-columns:repeat(2,1fr); }
  }

  @media (max-width:900px){
    .hero__grid{ grid-template-columns:1fr; }
    .tent{ max-width:520px; }
    .combo-grid{ grid-template-columns:1fr; max-width:520px; }
    .contact-grid{ grid-template-columns:1fr; }
    .section-head h2{ max-width:100%; }
    .section-head p{ max-width:100%; }
  }

  /* --- tablet chico y celular --- */
  @media (max-width:820px){
    :root{ --bar-h: 76px; }
    .nav-links, .nav-cta{ display:none; }
    .burger{ display:flex; }
    .wa-float{ display:none; }               /* la barra fija ya cubre WhatsApp */
    .action-bar{ display:flex; }
    html{ scroll-padding-top:74px; }
  }

  @media (max-width:640px){
    .why-grid{ grid-template-columns:1fr; }
    .steps{ grid-template-columns:1fr; row-gap:0; }
    .step{ display:grid; grid-template-columns:54px 1fr; column-gap:16px; padding-bottom:26px; }
    .step__num{ grid-row:1 / span 2; margin-bottom:0; }
    .step:not(:last-child)::after{           /* línea vertical del proceso */
      content:""; position:absolute; left:26px; top:56px; bottom:6px; width:3px;
      background-image:linear-gradient(180deg, var(--ink) 0 10px, transparent 10px 18px);
      background-size:3px 18px; opacity:.3;
    }
    .menu-grid{ grid-template-columns:1fr; gap:16px; }
    .stall{ display:grid; grid-template-columns:1fr; }
    .stall__body{ padding:22px 20px; }
    .stall p{ margin-bottom:14px; }
    .trust__grid{ grid-template-columns:1fr; gap:12px; }
    .hero__stats{ grid-template-columns:1fr; gap:14px; text-align:left; }
    .stat{ display:flex; align-items:baseline; gap:10px; }
    .stat b{ font-size:24px; }
    .stat span{ margin-top:0; }
    .hero__cta{ flex-direction:column; }
    .hero__cta .btn{ width:100%; min-width:0; }
    .tent__body{ grid-template-columns:1fr 1fr; padding:16px; gap:10px; }
    .tent-item{ padding:14px 12px; }
    .tent-item svg{ width:36px; height:36px; }
    .tent-item b{ font-size:13.5px; }
    .field-row{ grid-template-columns:1fr; }
    .testi-grid{ grid-template-columns:1fr; }
    .foot-bottom{ flex-direction:column; align-items:center; text-align:center; }
    .ticker__group span{ padding:0 16px; font-size:11px; }
  }

  @media (max-width:520px){
    .logo-mark{ width:44px; height:44px; }
    .logo-mark--lg{ width:62px; height:62px; }
  }
  @media (max-width:380px){
    .tent__body{ grid-template-columns:1fr; }
    .action-bar .btn{ font-size:13.5px; gap:6px; }
  }

/* =========================================================
   BLOG
   ========================================================= */
.page-nav{ display:flex; gap:26px; align-items:center; }
.page-nav a{ text-decoration:none; font-weight:700; font-size:14.5px; }
.page-nav a:hover{ color:var(--cherry); }

@media (max-width:980px){
  .page-nav{ gap:16px; }
  .page-nav a{ font-size:13.5px; }
}
.logo-img{ width:52px; height:52px; flex:none; object-fit:contain; }
@media (max-width:520px){ .logo-img{ width:44px; height:44px; } }
@media (max-width:820px){ .page-nav{ display:none; } }

.breadcrumb{ font-size:13px; color:var(--muted); margin-bottom:18px; }
.breadcrumb a{ color:var(--turquoise-dark); text-decoration:none; font-weight:700; }

/* portada del blog */
.blog-hero{
  background:
    radial-gradient(circle at 15% 20%, rgba(31,173,166,0.13), transparent 45%),
    radial-gradient(circle at 85% 10%, rgba(240,166,58,0.18), transparent 42%),
    var(--cream);
  padding: clamp(36px,6vw,64px) 0 clamp(32px,5vw,52px);
  text-align:center;
}
.blog-hero h1{ font-size:clamp(30px,6.4vw,52px); max-width:20ch; margin:0 auto; }
.blog-hero p{ max-width:56ch; margin:18px auto 0; color:var(--muted); font-size:clamp(15px,2vw,17.5px); }

.post-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:22px; }
@media (max-width:900px){ .post-grid{ grid-template-columns:1fr; max-width:560px; margin:0 auto; } }
.post-card{
  background:var(--cream); border:1px solid var(--line);
  border-radius:0 0 var(--radius) var(--radius);
  overflow:hidden; display:flex; flex-direction:column;
  transition:transform .25s ease, box-shadow .25s ease;
}
.post-card:hover{ transform:translateY(-6px); box-shadow:var(--shadow); }
.post-card__roof{ height:10px; background:var(--card-color,var(--cherry)); }
.post-card__awning{
  height:24px; background:var(--card-color,var(--cherry));
  -webkit-mask: radial-gradient(circle at 12px 24px, transparent 11.5px, #000 12px) bottom/24px 24px repeat-x;
  mask: radial-gradient(circle at 12px 24px, transparent 11.5px, #000 12px) bottom/24px 24px repeat-x;
}
.post-card__body{ padding:26px 22px 24px; display:flex; flex-direction:column; flex:1; }
.post-card h2{ font-size:20px; margin-bottom:10px; }
.post-card h2 a{ text-decoration:none; }
.post-card h2 a:hover{ color:var(--cherry-dark); }
.post-card p{ font-size:14.5px; color:var(--muted); margin:0 0 18px; flex:1; }
.post-card .post-meta{ font-size:11.5px; color:var(--muted-2); margin-bottom:12px; }
.post-card .read-more{ font-weight:700; font-size:14px; color:var(--cherry-dark); text-decoration:none; }
.post-card .read-more::after{ content:" →"; }

/* articulo */
.post-header{ background:var(--cream); padding: clamp(30px,5vw,56px) 0 clamp(24px,4vw,40px); }
.post-header h1{ font-size:clamp(28px,5.6vw,46px); max-width:22ch; }
.post-meta{
  font-family:'IBM Plex Mono',monospace; font-size:11.5px; text-transform:uppercase;
  letter-spacing:0.08em; color:var(--turquoise-dark); margin-bottom:16px;
}
.post-lede{ font-size:clamp(16px,2.1vw,19px); color:var(--muted); max-width:60ch; margin-top:18px; }

.post-body{ background:var(--paper); padding: clamp(40px,6vw,72px) 0; }
.post-body .wrap{ max-width:760px; }
.post-body h2{ font-size:clamp(22px,3.6vw,30px); margin:44px 0 14px; }
.post-body h2:first-child{ margin-top:0; }
.post-body h3{ font-size:clamp(18px,2.6vw,21px); margin:30px 0 10px; }
.post-body p{ font-size:16.5px; line-height:1.72; margin:0 0 18px; color:#402A18; }
.post-body ul, .post-body ol{ margin:0 0 22px; padding-left:0; }
.post-body li{
  font-size:16.5px; line-height:1.65; margin-bottom:10px;
  padding-left:28px; position:relative; list-style:none;
}
.post-body ul li::before{
  content:""; position:absolute; left:2px; top:9px;
  width:13px; height:7px; border-left:2.5px solid var(--turquoise-dark);
  border-bottom:2.5px solid var(--turquoise-dark); transform:rotate(-45deg);
}
.post-body ol{ counter-reset:n; }
.post-body ol li{ counter-increment:n; }
.post-body ol li::before{
  content:counter(n); position:absolute; left:0; top:2px;
  width:20px; height:20px; border-radius:50%; background:var(--cherry); color:var(--paper);
  font-family:'Fredoka',sans-serif; font-size:12px; font-weight:700;
  display:flex; align-items:center; justify-content:center;
}
.post-body strong{ font-weight:700; color:var(--ink); }
.post-body a{ color:var(--cherry-dark); font-weight:700; }

.callout{
  background:var(--cream); border-left:5px solid var(--mustard);
  border-radius:0 var(--radius-sm) var(--radius-sm) 0;
  padding:20px 22px; margin:28px 0;
}
.callout p:last-child{ margin-bottom:0; }
.callout b{ font-family:'Fredoka',sans-serif; font-size:16px; display:block; margin-bottom:6px; }

.post-table{ width:100%; border-collapse:collapse; margin:24px 0; font-size:15px; }
.post-table th, .post-table td{ padding:12px 14px; text-align:left; border-bottom:1px solid var(--line); }
.post-table thead th{ background:var(--ink); color:var(--cream); font-family:'Fredoka',sans-serif; font-weight:600; }
.post-table tbody tr:nth-child(even){ background:var(--cream); }
.table-scroll{ overflow-x:auto; -webkit-overflow-scrolling:touch; }

/* bloque de anuncio */
.ad-slot{
  margin:36px 0; padding:0; text-align:center; min-height:1px;
}
.ad-slot__label{
  font-family:'IBM Plex Mono',monospace; font-size:10px; letter-spacing:0.1em;
  text-transform:uppercase; color:var(--muted-2); margin-bottom:8px; display:block;
}

/* cierre del articulo */
.post-cta{
  background:var(--ink); color:var(--cream); border-radius:var(--radius);
  padding: clamp(26px,4vw,38px); margin-top:48px; text-align:center;
}
.post-cta h3{ font-size:clamp(20px,3vw,26px); margin-bottom:10px; }
.post-cta p{ color:#D6BFA4; font-size:15px; max-width:46ch; margin:0 auto 22px; }
.post-cta .btn + .btn{ margin-left:10px; }
@media (max-width:520px){
  .post-cta .btn{ width:100%; }
  .post-cta .btn + .btn{ margin-left:0; margin-top:10px; }
}
.post-more{ background:var(--cream); }

@media (max-width:820px){
  .nav-cta--blog{ display:flex; }
  .nav-cta--blog .btn{ padding:11px 16px; font-size:13.5px; min-height:42px; }
}

/* ===== fotos del blog ===== */

/* miniatura dentro de las tarjetas del listado */
.post-card__foto{ display:block; line-height:0; background:var(--cream-2); }
.post-card__foto img{
  width:100%; height:auto; display:block;
  aspect-ratio: 4 / 3; object-fit:cover;
  transition:transform .4s ease;
}
.post-card:hover .post-card__foto img{ transform:scale(1.04); }

/* galeria del listado */
.blog-galeria{ margin:clamp(40px,6vw,64px) 0 0; text-align:center; }
.blog-galeria h2{ font-size:clamp(22px,3.6vw,30px); margin-bottom:8px; }
.blog-galeria__intro{ color:var(--muted); font-size:15px; max-width:52ch; margin:0 auto 26px; }
.blog-galeria__grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:18px; }
.blog-galeria figure{ margin:0; }
.blog-galeria img{
  width:100%; aspect-ratio: 4 / 3; object-fit:cover; display:block;
  border-radius:var(--radius-sm); border:1px solid var(--line);
}
.blog-galeria figcaption{
  margin-top:8px; font-size:13px; color:var(--muted); line-height:1.4;
}
@media (max-width:700px){
  .blog-galeria__grid{ grid-template-columns:1fr 1fr; gap:12px; }
  .blog-galeria figure:last-child{ grid-column:1 / -1; }
}

/* imagenes dentro de un articulo (blog-*.html) */
.blog-figura{ margin:32px 0; }
.blog-figura img{
  width:100%; height:auto; display:block;
  border-radius:var(--radius-sm); border:1px solid var(--line);
}
.blog-figura figcaption{
  margin-top:10px; font-size:13.5px; color:var(--muted);
  text-align:center; line-height:1.5; font-style:italic;
}