/* DiniDine — tema crema / negro / dorado (playbook aprobado 5 oct 2026, modelo: activa.html).
   Capa final del home ES/EN: se carga después de todo el CSS. Solo diseño: no toca IDs ni lógica. */
:root{
  --black:#0B0B0A;--cream:#FBF7EE;--paper:#FFFFFF;--sand:#F3EBDA;--line:#E8DDC6;
  --ink:#1C1A16;--muted:#6F675B;--gold:#C9A24B;--gold-d:#A8822F;--gold-l:#EAD5A0;--gold-light:#EAD5A0;
  --bg:#FBF7EE;--bg-alt:#FFFFFF;--card:#FFFFFF;
  --btn-gold:linear-gradient(180deg,#E9CD82,#C9A24B);
  --serif:"Playfair Display",Georgia,serif;--sans:Inter,system-ui,-apple-system,sans-serif;
  --shadow-card:0 14px 34px rgba(60,40,10,.10);
}
html,body{overflow-x:clip;}
body{background:var(--cream);color:var(--ink);font-family:var(--sans);}
body::before,.dd-stars{display:none;}
:focus-visible{outline:3px solid var(--gold-d);outline-offset:3px;}
h1,h2,h3{font-family:var(--serif);font-weight:800;letter-spacing:-.01em;}
h1 em,h2 em{font-family:var(--serif);font-style:normal;font-weight:800;letter-spacing:-.01em;color:var(--gold-d);}
.eyebrow{color:var(--gold-d);font-weight:700;letter-spacing:.14em;}
.section-head h2{font-weight:800;letter-spacing:-.01em;color:var(--ink);}
.section-head p.deck{color:var(--muted);}
.hr{display:none;}

/* Botones */
.btn-primary,.submit,.nav-cta-primary{background:var(--btn-gold);color:#1a1408;border:0;border-radius:14px;font-family:var(--sans);font-weight:800;box-shadow:0 10px 24px rgba(201,162,75,.35);}
.btn-primary:hover,.submit:hover,.nav-cta-primary:hover{background:var(--btn-gold);filter:brightness(1.04);box-shadow:0 12px 28px rgba(201,162,75,.45);}
.nav-cta-primary{border-radius:12px;box-shadow:0 6px 16px rgba(201,162,75,.30);}

/* Navegación: negra, continúa en el hero */
nav{background:rgba(11,11,10,.94);border-bottom:0;}
.logo-mark span{color:#fff;}
.nav-secondary,.nav-lang{color:#CFC6B5;}
.nav-secondary:hover,.nav-lang:hover{color:#fff;border-color:transparent;}

/* HERO: único bloque negro arriba, esquinas inferiores redondeadas */
.hero{color:#fff;overflow:visible;overflow-y:clip;padding-bottom:64px;}
.hero::before{content:"";position:absolute;z-index:-2;top:0;bottom:0;left:50%;width:100vw;transform:translateX(-50%);
  background:radial-gradient(120% 70% at 50% 0%,#2a2214 0%,var(--black) 60%);border-radius:0 0 28px 28px;pointer-events:none;}
.hero h1{color:#fff;font-weight:800;letter-spacing:-.015em;line-height:1.1;}
.hero h1 em{color:var(--gold-l);}
.hero .eyebrow{display:inline-block;font-size:.66rem;font-weight:600;letter-spacing:.12em;color:var(--gold-l);background:rgba(201,162,75,.14);border:1px solid rgba(201,162,75,.35);padding:6px 12px;border-radius:99px;}
.hero p.sub{color:#D9D1C2;}
.concierge-intro span{color:#CFC6B5;}
.concierge-intro strong{color:var(--gold-l);font-weight:600;}
.hero-note{color:#B8AE9C;}
.hero-freedom{color:#CFC6B5;}
.stage-label{color:#B8AE9C;}
.stage-note{color:#CFC6B5;}
.stage-note>span{color:var(--gold);}
.stage-note a{color:var(--gold-l);}
.stage-orbit{border-color:rgba(201,162,75,.16);}
.hero-stage::before{background:radial-gradient(ellipse,rgba(201,162,75,.16),transparent 70%);}

/* Teléfono de ejemplo: oscuro y cálido (sin tonos oliva) */
.product-phone{background:#15130F;border-color:#4a4234;color:#F5F1E6;box-shadow:0 24px 60px rgba(28,26,22,.35);}
.restaurant-cover{background:linear-gradient(120deg,var(--preview-tint),#1d1a14);}
.sample-dish{background:#211E17;}
.chat-user{background:#2E2A21;color:#F5F1E6;}
.chat-prompts button{border-color:#4a4234;background:#1d1a14;color:#E6DFD0;}
.dish-tag{background:rgba(18,16,12,.85);}
.mobile-product-peek{border-color:rgba(201,162,75,.35);background:linear-gradient(120deg,#1f1a12,#141210);color:#fff;}
.peek-label,.peek-copy>span:not(.peek-label){color:#CFC6B5;}
.peek-copy strong{font-family:var(--serif);font-weight:700;}
.peek-copy .peek-action{color:var(--gold-l)!important;}

/* Franja de confianza */
.trust-strip{background:transparent;border:0;}
.trust-label{color:var(--muted);}
.trust-names span{font-family:var(--serif);font-weight:700;color:var(--ink);opacity:1;}

/* Solicitud de demo: tarjeta blanca */
.demo-request{background:none;}
.demo-studio{background:var(--paper);border:1px solid var(--line);border-radius:22px;box-shadow:var(--shadow-card);}
.studio-toolbar{background:#FDF9F1;border-bottom:1px solid var(--line);color:var(--muted);}
.status-dot{background:#1F7A4C;box-shadow:0 0 0 3px rgba(31,122,76,.15);}
.form-section-title>span{font-family:var(--serif);color:var(--gold-d);border-color:var(--line);background:var(--sand);}
.form-section-title h3{font-family:var(--serif);font-weight:700;color:var(--ink);}
.field label{color:var(--ink);font-weight:600;}
.field input{background:#fff;color:var(--ink);border:1.5px solid var(--line);border-radius:12px;font-family:var(--sans);}
.field input::placeholder{color:#A79F90;}
.field input:hover{border-color:#D9C9A6;}
.field input:focus{outline:none;border-color:var(--gold);background:#fff;box-shadow:0 0 0 3px rgba(201,162,75,.22);}
.field-hint,.contact-intro,.fine{color:var(--muted);}
.accent-picker legend{color:var(--ink);}
.accent-option{background:var(--cream);border:1px solid var(--line);color:var(--ink);border-radius:12px;}
.accent-option[aria-pressed="true"]{background:#FFFBF0;border-color:var(--gold);color:var(--ink);box-shadow:0 0 0 2px rgba(201,162,75,.18);}
.form-progress span{background:var(--line);}
.form-progress span.complete{background:var(--gold);}
.form-error{color:#B3261E;}
.form-error a{color:#B3261E;}
.preview-panel{background:radial-gradient(ellipse at 50% 40%,rgba(201,162,75,.20),transparent 72%),var(--sand);border-left:1px solid var(--line);}
.preview-eyebrow{color:var(--gold-d);font-weight:700;}
.preview-live{border-color:var(--line);background:#fff;color:var(--muted);}
.preview-caption{color:var(--muted);}
.success h3{color:var(--ink);}
.success p{color:var(--muted);}
.success .check2{background:var(--gold);border:0;color:#fff;}
.text-link{color:var(--gold-d);font-weight:600;}
.style-details summary,.email-details summary{color:var(--ink);}

/* Carrusel de logos sobre crema */
.dd-logos{background:transparent;border:0;}
.dd-logos-kicker{color:var(--gold-d);font-family:var(--sans);}
.dd-logo-chip{border:1px solid var(--line);box-shadow:none;font-family:var(--serif);}

/* Ejemplos de restaurantes */
.restaurant-showcase{background:transparent;}
.showcase-enhanced .showcase-tabs{background:var(--paper);border:1px solid var(--line);border-radius:14px;}
.showcase-tabs button{color:var(--muted);font-weight:600;}
.showcase-tabs button[aria-selected="true"]{background:var(--black);color:var(--gold-l);box-shadow:none;}
.showcase-panel{background:var(--paper);border:1px solid var(--line);border-radius:22px;box-shadow:var(--shadow-card);}
.real-menus-art,.links-art{background:radial-gradient(ellipse at top,rgba(201,162,75,.22),transparent 75%),var(--sand);}
.identity-art{background:linear-gradient(140deg,var(--sand),#EADFC6);}
.real-menu-rail{scrollbar-color:var(--gold) var(--sand);}
.real-menu-screen{border-color:var(--ink);box-shadow:0 10px 22px rgba(28,26,22,.18);}
.real-menu-card figcaption{font-family:var(--serif);font-weight:700;color:var(--ink);}
.real-menu-card figcaption>span{color:var(--muted);font-family:var(--sans);font-weight:400;}
.real-menu-hint{color:var(--muted);}
.real-menu-hint>span{color:var(--gold-d)!important;}
.identity-art figure{box-shadow:0 8px 20px rgba(60,40,10,.14);}
.identity-art figcaption{font-family:var(--serif);font-weight:700;}
.hub-example{box-shadow:0 16px 35px rgba(28,26,22,.25);}
.showcase-kind{color:var(--gold-d);font-weight:700;letter-spacing:.12em;}
.showcase-copy h3{font-family:var(--serif);font-weight:800;color:var(--ink);}
.showcase-copy p{color:var(--muted);}
.showcase-copy p.showcase-source{color:#8F8676;}
.showcase-invitation strong{font-family:var(--serif);font-weight:700;color:var(--ink);}

/* Video del menú */
.menu-film{background:var(--paper);border:1px solid var(--line);border-radius:18px;}
.menu-film>summary{color:var(--ink);font-weight:600;}
.menu-film>summary>span{color:var(--gold-d);}
.menu-film>summary small,.menu-film-content p{color:var(--muted);}
.menu-film-content video{border-color:var(--line);background:var(--ink);}

/* Beneficios: tarjetas blancas con ícono dorado en cuadrito arena */
.benefit{background:var(--paper);border:1px solid var(--line);border-radius:20px;}
.benefit .check{width:46px;height:46px;border:0;border-radius:14px;background:var(--sand);color:var(--gold-d);}
.benefit .check svg{width:24px;height:24px;stroke:var(--gold-d);fill:none;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round;}
.benefit strong{font-family:var(--sans);font-weight:800;color:var(--ink);}
.benefit p{color:var(--muted);}

/* Planes: siempre 2 columnas */
.pricing-grid{grid-template-columns:1fr 1fr;gap:14px;max-width:760px;margin:0 auto;}
.price-card{background:var(--paper);border:1px solid var(--line);border-radius:20px;padding:30px 24px 22px;}
.price-card.featured{border:2px solid var(--gold);background:linear-gradient(180deg,#FFFBF0,#fff);box-shadow:var(--shadow-card);}
.price-card .tag{left:50%;transform:translateX(-50%);background:var(--black);color:var(--gold-l);font-family:var(--sans);font-weight:700;letter-spacing:.06em;border-radius:99px;padding:4px 10px;white-space:nowrap;}
.price-card h3{font-family:var(--sans);font-size:.78rem;font-weight:700;letter-spacing:.08em;color:var(--gold-d);}
.price-card .amount{font-family:var(--sans);font-weight:800;color:var(--ink);font-size:2.4rem;line-height:1;margin:10px 0 0;}
.price-card .amount small{font-family:var(--sans);color:var(--muted);font-weight:600;}
.plan-summary{color:var(--muted);}
.plan-details summary{color:var(--gold-d);font-weight:600;}
.price-card li{color:var(--ink);padding-left:18px;position:relative;display:block;}
.price-card li::before{content:"";position:absolute;left:1px;top:.4em;width:9px;height:5px;border-left:2px solid var(--gold-d);border-bottom:2px solid var(--gold-d);transform:rotate(-45deg);}
.pricing-setup{max-width:760px;margin:16px auto 0;background:var(--black);color:#CFC6B5;border:0;border-radius:18px;padding:16px 18px;}
.pricing-setup strong{color:var(--gold-l);}
.pricing-cta p a{color:var(--gold-d);font-weight:600;text-underline-offset:4px;}
.no-contract-note{background:var(--sand);border:1px solid var(--line);color:var(--ink);font-family:var(--sans);}
.no-contract-note .ncb-check{background:var(--gold-d);color:#fff;}

/* Fundador */
.home-founder{padding:20px 0 10px;}
.home-founder .founder{background:var(--paper);border:1px solid var(--line);border-radius:22px;padding:18px;display:flex;gap:16px;align-items:center;max-width:620px;margin:0 auto;box-shadow:var(--shadow-card);}
.home-founder .founder-photo{flex:0 0 96px;width:96px;height:120px;border-radius:16px;object-fit:cover;object-position:50% 30%;border:2px solid var(--gold);box-shadow:0 8px 20px rgba(28,26,22,.12);display:block;}
.home-founder q{display:block;font-size:1rem;line-height:1.45;quotes:none;color:var(--ink);}
.home-founder small{display:block;margin-top:8px;color:var(--muted);font-size:.84rem;}
.home-founder small b{color:var(--ink);}

/* Preguntas frecuentes: tarjetas */
.demo-faq{border-top:0;}
.demo-faq details{background:var(--paper);border:1px solid var(--line);border-radius:14px;padding:0;margin-bottom:8px;}
.demo-faq summary{padding:15px 16px;font-weight:600;color:var(--ink);font-size:.95rem;}
.demo-faq summary::after{color:var(--gold-d);font-size:1.4rem;font-weight:400;}
.demo-faq details p{margin:0;padding:0 16px 15px;color:var(--muted);}

/* Cierre negro */
.request-close{background:radial-gradient(120% 90% at 50% 0%,#2a2214,var(--black) 65%);color:#fff;border-radius:26px;max-width:1000px;margin:24px auto 56px;padding:46px 24px;}
.request-close h2{color:#fff;font-weight:800;}

/* Pie de página y flotantes */
footer{border-top:1px solid var(--line);}
footer .foot-logo span{font-family:var(--sans);color:var(--muted);}
footer .foot-links a{color:var(--muted);}
footer .foot-links a:hover{color:var(--gold-d);}
.wa-float{background:var(--black);color:var(--gold-l);border:1px solid var(--gold);box-shadow:0 8px 22px rgba(28,26,22,.28);}

@media(max-width:820px){
  .pricing-grid{grid-template-columns:1fr 1fr;}
  .hero{padding-bottom:40px;}
}
@media(max-width:620px){
  .hero::before{border-radius:0 0 24px 24px;}
  .preview-panel{border-left:0;border-block:1px solid var(--line);background:radial-gradient(ellipse at 50% 0%,rgba(201,162,75,.20),transparent 75%),var(--sand);}
  .preview-panel .product-phone{border-color:#4a4234;box-shadow:0 10px 20px rgba(28,26,22,.25);}
  .demo-studio{border-color:var(--line);border-radius:18px;}
  .is-enhanced .studio-stepper{background:#FDF9F1;border-bottom:1px solid var(--line);}
  .studio-stepper li{color:var(--muted);}
  .studio-stepper li>span{border-color:var(--line);}
  .studio-stepper li[aria-current="step"]{color:var(--ink);font-weight:600;}
  .studio-stepper li[aria-current="step"]>span{background:var(--btn-gold);border-color:var(--gold);color:#1a1408;}
  .mobile-next p{color:var(--muted);}
  .is-enhanced .contact-context{border-bottom-color:var(--line);}
  .contact-context button{color:var(--gold-d);font-weight:600;}
  .contact-context [data-restaurant-name]{font-family:var(--serif);font-weight:700;}
  .context-check{color:#1F7A4C;}
  .mobile-demo-dock{background:rgba(251,247,238,.96);border-top:1px solid var(--line);box-shadow:0 -8px 24px rgba(60,40,10,.10);}
  .mobile-demo-dock>span{color:var(--ink);font-weight:600;}
  .mobile-demo-dock small{color:var(--muted);font-weight:400;}
  .mobile-demo-dock>a{background:var(--btn-gold);color:#1a1408;border-radius:12px;font-weight:800;}
  .pricing-grid{gap:10px;}
  .price-card{padding:24px 12px 14px;border-radius:18px;}
  .price-card .tag{font-size:.56rem;}
  .price-card h3{font-size:.66rem;letter-spacing:.05em;}
  .price-card .amount{font-size:2rem;}
  .price-card .amount small{font-size:.72rem;}
  .plan-summary{font-size:.8rem;margin:12px 0 4px;}
  .plan-details summary{font-size:.78rem;}
  .price-card li{font-size:.76rem;}
  .pricing-setup{font-size:.82rem;}
  .home-founder .founder{gap:14px;padding:16px;}
  .home-founder .founder-photo{flex-basis:84px;width:84px;height:106px;}
  .home-founder q{font-size:.92rem;}
  .request-close{margin:18px 16px 40px;padding:36px 18px;}
}

/* ---------- Movimiento (home-motion.js). Sin JS o con movimiento reducido, todo queda visible. ---------- */
.dd-progress{position:fixed;top:0;left:0;width:100%;height:3px;z-index:120;pointer-events:none;transform-origin:0 50%;transform:scaleX(0);background:linear-gradient(90deg,#E9CD82,#C9A24B);}
nav{transition:box-shadow .3s ease,background .3s ease;}
nav.scrolled{box-shadow:0 10px 28px rgba(0,0,0,.22);}
.dd-logos{padding:34px 0 8px;}
.js-motion .rv{opacity:0;transform:translateY(20px);transition:opacity .65s ease,transform .65s cubic-bezier(.2,.8,.2,1);}
.js-motion .rv.in{opacity:1;transform:none;}

/* Hero: brillo dorado en la frase, teléfono flotando y brillo en el botón */
.hero h1 em{background:linear-gradient(100deg,var(--gold-l) 35%,#FFF4D6 50%,var(--gold-l) 65%);background-size:250% 100%;-webkit-background-clip:text;background-clip:text;color:transparent;animation:dd-sheen 6s ease-in-out 1.2s infinite;}
@keyframes dd-sheen{0%{background-position:100% 0;}35%,100%{background-position:-60% 0;}}
.hero .product-phone{animation:dd-float 6s ease-in-out infinite;}
@keyframes dd-float{0%,100%{transform:translateY(0);}50%{transform:translateY(-10px);}}
.btn-primary,.mobile-demo-dock>a{position:relative;overflow:hidden;}
.btn-primary::before,.mobile-demo-dock>a::before{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(100deg,transparent 30%,rgba(255,255,255,.5) 50%,transparent 70%);transform:translateX(-120%);animation:dd-btn-sheen 5s ease-in-out 2s infinite;}
@keyframes dd-btn-sheen{0%{transform:translateX(-120%);}28%,100%{transform:translateX(120%);}}

/* Tarjetas que responden al cursor */
.benefit,.price-card,.demo-faq details,.dd-logo-chip{transition:opacity .65s ease,transform .3s ease,box-shadow .3s ease,border-color .3s ease;}
.benefit:hover,.price-card:hover{transform:translateY(-4px);box-shadow:var(--shadow-card);border-color:#DCCBA6;}
.price-card.featured:hover{border-color:var(--gold);}
.dd-logo-chip:hover{transform:translateY(-3px);border-color:var(--gold);}
.demo-faq details:hover{border-color:#DCCBA6;}
.price-card.featured{animation:dd-plan-glow 2.8s ease-in-out infinite;}
@keyframes dd-plan-glow{0%,100%{box-shadow:var(--shadow-card),0 0 0 0 rgba(201,162,75,.38);}50%{box-shadow:var(--shadow-card),0 0 0 9px rgba(201,162,75,0);}}

/* Cómo funciona: 4 pasos con línea punteada que se dibuja */
.how{padding:10px 0 64px;}
.how .section-head{margin-bottom:34px;}
.how-steps{list-style:none;margin:0 auto;padding:0;display:grid;grid-template-columns:repeat(4,1fr);gap:8px;max-width:820px;position:relative;}
.how-steps::before{content:"";position:absolute;top:27px;left:12.5%;right:12.5%;height:2px;background:repeating-linear-gradient(90deg,var(--gold) 0 6px,transparent 6px 12px);transform-origin:0 50%;}
.how-step{text-align:center;position:relative;}
.how-step .n{width:56px;height:56px;border-radius:50%;margin:0 auto 12px;background:var(--black);color:var(--gold-l);font-family:var(--serif);font-weight:800;font-size:1.3rem;display:grid;place-items:center;border:4px solid var(--cream);box-shadow:0 8px 18px rgba(28,26,22,.18);}
.how-step b{display:block;font-size:.95rem;line-height:1.3;color:var(--ink);}
.js-motion .how-steps::before{transform:scaleX(0);transition:transform 1.4s cubic-bezier(.4,0,.2,1) .2s;}
.js-motion .how-steps.play::before{transform:scaleX(1);}
.js-motion .how-step .n{transform:scale(.5);opacity:0;transition:transform .55s cubic-bezier(.3,1.6,.5,1),opacity .4s;}
.js-motion .how-steps.play .how-step .n{transform:none;opacity:1;}
.js-motion .how-steps.play .how-step:nth-child(2) .n{transition-delay:.35s;}
.js-motion .how-steps.play .how-step:nth-child(3) .n{transition-delay:.7s;}
.js-motion .how-steps.play .how-step:nth-child(4) .n{transition-delay:1.05s;}
@media(max-width:620px){
  .dd-logos{padding:26px 0 4px;}
  .how{padding-bottom:44px;}
  .how-steps{gap:4px;}
  .how-steps::before{top:21px;}
  .how-step .n{width:44px;height:44px;font-size:1.05rem;border-width:3px;}
  .how-step b{font-size:.76rem;}
}
@media(prefers-reduced-motion:reduce){
  .hero h1 em{animation:none;background:none;color:var(--gold-l);}
  .hero .product-phone,.price-card.featured,.btn-primary::before,.mobile-demo-dock>a::before{animation:none;}
  .dd-progress{display:none;}
}

/* ---------- Clics estratégicos ---------- */
/* Hero: línea discreta para curiosos (el foco sigue siendo el formulario) */
.hero-alt{margin:12px 0 0;font-size:.78rem;color:#B8AE9C;line-height:1.6;}
.hero-alt>span:first-child{color:#8F8676;}
.hero-alt a{color:#E6DFD0;text-decoration:underline;text-decoration-color:rgba(234,213,160,.35);text-underline-offset:4px;}
.hero-alt a:hover{color:var(--gold-l);text-decoration-color:var(--gold-l);}
.hero-alt .hero-watch>span{font-size:.62rem;color:var(--gold);}
@media(max-width:820px){.hero-alt{text-align:center;font-size:.76rem;}}
/* Menús reales: toda la tarjeta abre el menú en vivo */
.real-menu-card{position:relative;}
.real-menu-card.is-live .real-menu-screen{transition:transform .3s ease,box-shadow .3s ease;}
.real-menu-card.is-live:hover .real-menu-screen{transform:translateY(-4px);box-shadow:0 16px 28px rgba(28,26,22,.25);}
.real-menu-open{display:inline-flex;align-items:center;gap:4px;margin-top:8px;padding:6px 10px;border-radius:99px;background:var(--black);color:var(--gold-l);font-family:var(--sans);font-size:.68rem;font-weight:700;text-decoration:none;white-space:nowrap;}
.real-menu-open::after{content:"";position:absolute;inset:0;border-radius:13px;}
.real-menu-open:focus-visible{outline:3px solid var(--gold-d);outline-offset:2px;}
.real-menu-card.is-live .real-menu-screen::after{content:"";}
/* Preguntas: enlaces dentro de la respuesta */
.demo-faq details p a{color:var(--gold-d);font-weight:600;text-underline-offset:3px;}
/* Cierre: WhatsApp como segunda opción */
.close-wa{display:block;width:fit-content;margin:16px auto 0;color:var(--gold-l);font-size:.9rem;font-weight:600;text-underline-offset:4px;}
.close-wa:hover{color:#fff;}
@media(max-width:620px){.real-menu-open{font-size:.64rem;padding:5px 9px;}}
