/* Eira Vet 4.3 · web pública y contratación. Requiere public/eira-tokens.css */
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body.site{margin:0;font-family:var(--eira-font-body);color:var(--eira-ink);background:var(--eira-paper);font-size:17px;line-height:1.6;-webkit-font-smoothing:antialiased}
:where(.site) a{color:inherit}
.wrap{width:min(1160px,100% - 48px);margin-inline:auto}
:where(.site) :is(h1,h2,h3){font-family:var(--eira-font-display);letter-spacing:-.02em;line-height:1.08;margin:0}
:where(.site) p{margin:0}
.skip{position:absolute;left:-999px}.skip:focus{left:16px;top:16px;background:#fff;padding:10px 14px;border-radius:8px;z-index:99}
:focus-visible{outline:none;box-shadow:var(--eira-focus);border-radius:8px}

/* navegación */
.nav{position:sticky;top:0;z-index:20;background:rgba(246,248,247,.9);backdrop-filter:saturate(1.4) blur(10px);border-bottom:1px solid transparent}
.nav.is-scrolled{border-bottom-color:var(--eira-line)}
.nav .wrap{display:flex;align-items:center;gap:32px;height:72px}
.brand{display:inline-flex;align-items:center;gap:10px;font-family:var(--eira-font-display);font-weight:700;font-size:20px;text-decoration:none}
.brand .eira-logo-mark{color:var(--eira-pine)}
.nav-links{display:flex;gap:28px;margin-left:auto;font-size:15px;font-weight:500}
.nav-links a{text-decoration:none;color:var(--eira-ink-soft)}
.nav-links a:hover{color:var(--eira-ink)}
.nav-cta{display:flex;gap:10px;align-items:center}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;border:1px solid transparent;border-radius:var(--eira-radius);padding:12px 20px;font:600 15px var(--eira-font-body);text-decoration:none;cursor:pointer;transition:background .15s,border-color .15s}
.btn-primary{background:var(--eira-pine);color:#fff}
.btn-primary:hover{background:var(--eira-pine-deep)}
.btn-ghost{background:transparent;color:var(--eira-ink);border-color:var(--eira-line)}
.btn-ghost:hover{background:#fff}
.btn-lg{padding:15px 26px;font-size:16px}
.btn-sun{background:var(--eira-sun);color:var(--eira-ink)}
.btn-sun:hover{background:#eaa91f}
@media (max-width:860px){.nav-links{display:none}.nav .wrap{gap:12px}.nav-cta{margin-left:auto}.nav-cta .btn-primary{display:none}}

/* ===================== Página principal 4.3.1 ===================== */
.price-amount{display:flex;align-items:flex-start;gap:6px;margin:18px 0 6px;font-family:var(--eira-font-display);color:var(--eira-ink);line-height:.9}
.price-amount .cur{font-size:28px;font-weight:700;margin-top:14px}
.price-amount .num{font-size:clamp(96px,12vw,150px);font-weight:800;letter-spacing:-.05em}
.price-per{font-size:18px;color:var(--eira-ink-soft)}

/* hero */
.hero{position:relative;padding:56px 0 88px;overflow:hidden;background:linear-gradient(180deg,var(--eira-paper) 0%,#eef7f3 100%)}
.hero .wrap{display:grid;grid-template-columns:1.02fr 1fr;gap:40px;align-items:center;position:relative;z-index:1}
.hero .wrap>*,.wa .wrap>*,.tour>*{min-width:0}
.hero-pill{display:inline-flex;align-items:center;gap:8px;padding:7px 14px 7px 8px;border-radius:999px;background:#fff;border:1px solid var(--eira-line);font-size:14px;color:var(--eira-ink-soft);box-shadow:0 2px 10px rgba(19,37,58,.05)}
.hero-pill b{display:inline-flex;align-items:center;justify-content:center;height:24px;padding:0 10px;border-radius:999px;background:var(--eira-sun);color:var(--eira-ink);font-size:12px}
.hero h1{margin-top:22px;font-size:clamp(40px,5.3vw,76px);font-weight:800;letter-spacing:-.035em;line-height:.98}
.hero h1 .line{display:block;overflow:hidden;padding-bottom:.06em}
.hero h1 .line>span{display:inline-block}
.hero h1 .paw-word{position:relative;display:inline-block;color:var(--eira-pine);white-space:nowrap}
.hero h1 .paw-word svg{position:absolute;right:-.62em;top:-.18em;width:.52em;height:.52em;color:var(--eira-sun);transform:rotate(18deg)}
.hero-lead{margin-top:24px;font-size:19px;color:var(--eira-ink-soft);max-width:36ch}
.hero-actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:32px}
.hero-note{margin-top:20px;font-size:14px;color:var(--eira-ink-soft);display:flex;flex-wrap:wrap;gap:6px 18px}
.hero-note span{display:inline-flex;align-items:center;gap:6px}
.hero-note svg{width:16px;height:16px;color:var(--eira-pine)}

.stage{position:relative;aspect-ratio:1/0.92;min-height:340px}
.stage-blob{position:absolute;inset:4% 2% 0 6%;background:var(--eira-mint);border-radius:46% 54% 48% 52%/55% 45% 55% 45%;animation:blob 14s ease-in-out infinite}
.stage-blob.two{inset:14% -4% 10% 22%;background:#fde7b8;opacity:.55;animation-duration:18s;animation-direction:reverse}
@keyframes blob{0%,100%{border-radius:46% 54% 48% 52%/55% 45% 55% 45%}50%{border-radius:56% 44% 58% 42%/45% 57% 43% 55%}}
.stage .pets{position:absolute;left:4%;right:0;bottom:2%;width:96%;height:auto}
.float-card{position:absolute;display:flex;gap:10px;align-items:center;background:#fff;border:1px solid var(--eira-line);border-radius:14px;padding:10px 14px 10px 10px;box-shadow:0 14px 30px rgba(19,37,58,.12);font-size:13px;line-height:1.3;animation:bob 6s ease-in-out infinite}
.float-card b{display:block;font-size:14px;color:var(--eira-ink)}
.float-card small{color:var(--eira-ink-soft)}
.float-card .ic{flex:none;width:34px;height:34px;border-radius:10px;display:grid;place-items:center}
.float-card .ic svg{width:18px;height:18px}
.fc-appt{top:6%;left:-2%}.fc-appt .ic{background:var(--eira-mint);color:var(--eira-pine)}
.fc-vax{top:34%;right:-3%;animation-delay:-2s}.fc-vax .ic{background:#fdecc5;color:#9a6700}
.fc-pay{bottom:-1%;left:-6%;animation-delay:-4s}.fc-pay .ic{background:#e7f6ec;color:#127a4f}
@keyframes bob{0%,100%{transform:translateY(0)}50%{transform:translateY(-10px)}}

/* animaciones de las mascotas */
.pets .dog-tail{transform-origin:258px 360px;animation:wag .5s ease-in-out infinite alternate}
@keyframes wag{from{transform:rotate(-10deg)}to{transform:rotate(14deg)}}
.pets .cat-tail{transform-origin:468px 410px;animation:swish 3.2s ease-in-out infinite}
@keyframes swish{0%,100%{transform:rotate(0)}50%{transform:rotate(-9deg)}}
.pets .blink{transform-box:fill-box;transform-origin:center;animation:blink 5s infinite}
.pets .blink-cat{animation-delay:1.7s;animation-duration:6.5s}
@keyframes blink{0%,94%,100%{transform:scaleY(1)}96%{transform:scaleY(.1)}}
.pets .dog-head{transform-origin:194px 280px;animation:tilt 7s ease-in-out infinite}
@keyframes tilt{0%,70%,100%{transform:rotate(0)}78%,88%{transform:rotate(-6deg)}}
.pets .cat-ear-r{transform-box:fill-box;transform-origin:20% 100%;animation:twitch 4.5s infinite}
@keyframes twitch{0%,90%,100%{transform:rotate(0)}93%{transform:rotate(10deg)}96%{transform:rotate(-4deg)}}
.pets .heart{transform-box:fill-box;transform-origin:center;animation:heart 3s ease-in-out infinite}
@keyframes heart{0%,100%{transform:translateY(0) scale(1);opacity:1}50%{transform:translateY(-14px) scale(1.12);opacity:.85}}
.pets .dog-tag{transform-origin:193px 306px;animation:tag 1s ease-in-out infinite alternate}
@keyframes tag{from{transform:rotate(-8deg)}to{transform:rotate(8deg)}}

/* entrada del hero: una sola secuencia al cargar */
.js .hero h1 .line>span,.js .hero-pill,.js .hero-lead,.js .hero-actions,.js .hero-note{opacity:0;transform:translateY(24px)}
.js .stage{opacity:0;transform:scale(.96)}
.js .float-card{opacity:0}
.is-loaded .hero h1 .line>span,.is-loaded .hero-pill,.is-loaded .hero-lead,.is-loaded .hero-actions,.is-loaded .hero-note{opacity:1;transform:none;transition:opacity .7s ease,transform .8s cubic-bezier(.2,.8,.2,1)}
.is-loaded .hero h1 .line:nth-child(2)>span{transition-delay:.08s}
.is-loaded .hero-lead{transition-delay:.18s}.is-loaded .hero-actions{transition-delay:.26s}.is-loaded .hero-note{transition-delay:.34s}
.is-loaded .stage{opacity:1;transform:none;transition:opacity .8s ease .1s,transform 1s cubic-bezier(.2,.8,.2,1) .1s}
.is-loaded .float-card{opacity:1;transition:opacity .6s ease}
.is-loaded .fc-appt{transition-delay:.6s}.is-loaded .fc-vax{transition-delay:.85s}.is-loaded .fc-pay{transition-delay:1.1s}

/* huellas que cruzan */
.paw-trail{position:absolute;left:0;right:0;bottom:18px;height:40px;pointer-events:none;z-index:0}
.paw-trail svg{position:absolute;width:22px;height:22px;color:var(--eira-pine);opacity:0;animation:step 9s linear infinite}
@keyframes step{0%{opacity:0}4%{opacity:.22}30%{opacity:.22}40%{opacity:0}100%{opacity:0}}

/* cinta de servicios */
.marquee{background:var(--eira-pine-deep);color:#fff;overflow:hidden;white-space:nowrap;padding:18px 0;border-block:1px solid rgba(255,255,255,.08)}
.marquee-track{display:inline-flex;gap:0;animation:marquee 38s linear infinite}
.marquee:hover .marquee-track{animation-play-state:paused}
.marquee span{display:inline-flex;align-items:center;gap:22px;padding-right:22px;font-family:var(--eira-font-display);font-size:22px;font-weight:600}
.marquee span::after{content:"";width:10px;height:10px;border-radius:50%;background:var(--eira-sun)}
@keyframes marquee{to{transform:translateX(-50%)}}

/* secciones */
.section{padding:104px 0}
.section-head{max-width:660px;margin-bottom:56px}
.section-head h2{font-size:clamp(34px,4.4vw,54px);font-weight:800}
.section-head p{margin-top:16px;color:var(--eira-ink-soft);font-size:18px}
.js .reveal{opacity:0;transform:translateY(28px);transition:opacity .7s ease,transform .8s cubic-bezier(.2,.8,.2,1)}
.js .reveal.in{opacity:1;transform:none}

/* un día en la clínica */
.day{position:relative;display:grid;grid-template-columns:repeat(4,1fr);gap:22px}
.day::before{content:"";position:absolute;left:0;right:0;top:27px;height:3px;background:var(--eira-line);border-radius:3px}
.day-progress{position:absolute;left:0;top:27px;height:3px;width:0;background:var(--eira-pine);border-radius:3px;transition:width 1.8s cubic-bezier(.3,.7,.2,1)}
.day.in .day-progress{width:100%}
.day-step{position:relative;padding-top:64px}
.day-step .time{position:absolute;top:0;left:0;display:grid;place-items:center;min-width:56px;height:56px;padding:0 10px;border-radius:999px;white-space:nowrap;background:#fff;border:3px solid var(--eira-line);font-family:var(--eira-font-display);font-weight:700;font-size:14px;color:var(--eira-ink);transition:border-color .4s,background .4s,color .4s}
.day.in .day-step .time{border-color:var(--eira-pine);background:var(--eira-pine);color:#fff}
.day.in .day-step:nth-child(3) .time{transition-delay:.45s}.day.in .day-step:nth-child(4) .time{transition-delay:.9s}.day.in .day-step:nth-child(5) .time{transition-delay:1.35s}
.day-step h3{font-size:22px}
.day-step p{margin-top:8px;color:var(--eira-ink-soft);font-size:16px}

/* recorrido del producto */
.tour{display:grid;grid-template-columns:320px 1fr;gap:40px;align-items:start}
.tour-tabs{display:grid;gap:10px}
.tour-tab{text-align:left;border:1px solid var(--eira-line);background:#fff;border-radius:16px;padding:18px 18px 18px 20px;cursor:pointer;font:inherit;color:var(--eira-ink);position:relative;overflow:hidden;transition:border-color .2s,box-shadow .2s}
.tour-tab b{display:block;font-family:var(--eira-font-display);font-size:20px}
.tour-tab span{display:block;margin-top:4px;font-size:15px;color:var(--eira-ink-soft)}
.tour-tab[aria-selected="true"]{border-color:var(--eira-pine);box-shadow:0 10px 26px rgba(11,110,96,.12)}
.tour-tab .bar{position:absolute;left:0;bottom:0;height:3px;width:0;background:var(--eira-pine)}
.tour-tab[aria-selected="true"] .bar{animation:fill 6s linear forwards}
.tour.paused .tour-tab .bar{animation-play-state:paused}
@keyframes fill{to{width:100%}}
.tour-view{position:relative}
.tour-view .frame{background:#fff;border:1px solid var(--eira-line);border-radius:20px;box-shadow:var(--eira-shadow);overflow:hidden}
.frame-bar{display:flex;gap:6px;padding:12px 14px;border-bottom:1px solid var(--eira-line);background:#fbfcfc}
.frame-bar i{width:9px;height:9px;border-radius:50%;background:var(--eira-line)}
.tour-view img{display:block;width:100%;height:auto;filter:hue-rotate(-78deg) saturate(.9)}
.tour-view img[hidden]{display:none}
.tour-view img.show{animation:fadein .5s ease}
@keyframes fadein{from{opacity:0;transform:scale(.985)}to{opacity:1;transform:none}}

/* WhatsApp con teléfono */
.wa{background:var(--eira-pine-deep);color:#e8f5f0;position:relative;overflow:hidden}
.wa::before{content:"";position:absolute;width:520px;height:520px;border-radius:50%;border:80px solid rgba(255,255,255,.04);right:-160px;top:-160px}
.wa .wrap{display:grid;grid-template-columns:1fr 380px;gap:64px;align-items:center;position:relative}
.wa .section-head{margin-bottom:28px}
.wa .section-head h2{color:#fff}
.wa .section-head p{color:#b9dcd0}
.wa-points{list-style:none;margin:0;padding:0;display:grid;gap:14px}
.wa-points li{display:flex;gap:12px;align-items:flex-start;color:#dcefe8}
.wa-points svg{flex:none;width:22px;height:22px;color:var(--eira-sun);margin-top:2px}
.phone{justify-self:center;width:min(340px,100%);background:#0e1a24;border-radius:44px;padding:12px;box-shadow:0 40px 80px rgba(0,0,0,.35);transform:rotate(3deg)}
.phone-screen{background:#efe7dc;border-radius:34px;overflow:hidden;height:560px;display:flex;flex-direction:column}
.phone-top{background:#075e54;color:#fff;padding:36px 16px 12px;display:flex;align-items:center;gap:10px}
.phone-top .av{width:36px;height:36px;border-radius:50%;background:var(--eira-sun);display:grid;place-items:center;color:var(--eira-ink)}
.phone-top .av svg{width:20px;height:20px}
.phone-top b{display:block;font-size:15px}.phone-top small{font-size:12px;opacity:.8}
.chat{flex:1;padding:16px 12px;display:flex;flex-direction:column;gap:10px;justify-content:flex-end;overflow:hidden}
.msg{max-width:86%;background:#fff;color:#1f2a36;border-radius:12px 12px 12px 4px;padding:9px 12px 18px;font-size:14px;line-height:1.4;position:relative;box-shadow:0 1px 1px rgba(0,0,0,.08);opacity:1;transition:opacity .35s ease,transform .35s ease}
.js .msg{opacity:0;transform:translateY(10px) scale(.98)}
.js .msg.show{opacity:1;transform:none}
.msg time{position:absolute;right:10px;bottom:4px;font-size:10px;color:#8696a0}
.msg.out{align-self:flex-end;background:#d9fdd3;border-radius:12px 12px 4px 12px}
.typing{align-self:flex-start;background:#fff;border-radius:12px;padding:10px 14px;display:none;gap:4px}
.typing.show{display:inline-flex}
.typing i{width:7px;height:7px;border-radius:50%;background:#9aa7b0;animation:dot 1s infinite}
.typing i:nth-child(2){animation-delay:.15s}.typing i:nth-child(3){animation-delay:.3s}
@keyframes dot{0%,60%,100%{transform:translateY(0);opacity:.5}30%{transform:translateY(-4px);opacity:1}}

/* precio */
.price{padding:112px 0}
.price-card{display:grid;grid-template-columns:1fr 1fr;background:#fff;border:1px solid var(--eira-line);border-radius:32px;overflow:hidden;box-shadow:var(--eira-shadow)}
.price-main{position:relative;padding:56px;background:var(--eira-mint);overflow:hidden}
.price-main::after{content:"";position:absolute;width:260px;height:260px;border-radius:50%;background:var(--eira-sun);opacity:.35;right:-90px;bottom:-110px}
.price-main>*{position:relative;z-index:1}
.price-main h2{font-size:22px;font-family:var(--eira-font-body);font-weight:600;letter-spacing:0;color:var(--eira-pine-deep)}
.price-main .btn{margin-top:32px}
.price-main .fine{margin-top:14px;font-size:14px;color:var(--eira-ink-soft);max-width:34ch}
.price-list{padding:56px}
.price-list h3{font-size:22px;margin-bottom:20px}
.price-list ul{list-style:none;margin:0;padding:0;columns:2;column-gap:28px}
.price-list li{break-inside:avoid;padding:7px 0 7px 26px;position:relative;font-size:15px}
.price-list li::before{content:"";position:absolute;left:0;top:.72em;width:16px;height:16px;border-radius:50%;background:var(--eira-mint)}
.price-list li::after{content:"";position:absolute;left:5px;top:1.02em;width:6px;height:3px;border-left:2px solid var(--eira-pine);border-bottom:2px solid var(--eira-pine);transform:rotate(-45deg)}

/* preguntas */
.faq{max-width:780px}
.faq details{border-top:1px solid var(--eira-line);padding:22px 0}
.faq details:last-child{border-bottom:1px solid var(--eira-line)}
.faq summary{cursor:pointer;font-weight:600;font-size:18px;list-style:none;display:flex;justify-content:space-between;gap:16px;align-items:center}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"";flex:none;width:28px;height:28px;border-radius:50%;background:var(--eira-mint) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230b6e60' stroke-width='2.5' stroke-linecap='round'%3E%3Cpath d='M12 6v12M6 12h12'/%3E%3C/svg%3E") center/16px no-repeat;transition:transform .25s}
.faq details[open] summary::after{transform:rotate(45deg)}
.faq details p{margin-top:12px;color:var(--eira-ink-soft);max-width:65ch}

/* cierre con mascotas asomándose */
.closing{padding:40px 0 0}
.closing-band{position:relative;background:var(--eira-pine);border-radius:36px;padding:72px 56px;color:#fff;display:flex;flex-wrap:wrap;gap:28px;align-items:center;justify-content:space-between;margin-top:110px;overflow:visible}
.closing-band h2{font-size:clamp(30px,3.8vw,46px);max-width:17ch;color:#fff}
.closing-band p{margin-top:12px;color:#cfe8df}
.peek{position:absolute;top:-104px;right:64px;width:260px;height:auto;pointer-events:none}
.peek .paw-l,.peek .paw-r{transform-box:fill-box;transform-origin:center bottom}
.closing-band:hover .peek .dog-peek{transform:translateY(-8px)}
.peek .dog-peek{transition:transform .35s cubic-bezier(.2,.8,.2,1)}
.footer{margin-top:88px;border-top:1px solid var(--eira-line);padding:32px 0 calc(32px + env(safe-area-inset-bottom));font-size:14px;color:var(--eira-ink-soft)}
.footer .wrap{display:flex;flex-wrap:wrap;gap:12px 32px;justify-content:space-between;align-items:center}
.footer nav{display:flex;gap:20px}
.footer a{text-decoration:none;font-weight:600;color:var(--eira-ink)}
.footer a:hover{color:var(--eira-pine)}
.checkout+.footer{margin-top:0}

/* responsive */
@media (max-width:1020px){
  .hero .wrap{grid-template-columns:minmax(0,1fr);gap:28px}
  .stage{max-width:560px;width:100%;justify-self:center}
  .tour{grid-template-columns:minmax(0,1fr)}
  .tour-tabs{grid-template-columns:repeat(2,1fr)}
  .wa .wrap{grid-template-columns:minmax(0,1fr);gap:48px}
}
@media (max-width:760px){
  .section{padding:72px 0}
  .hero{padding:32px 0 72px}
  .float-card{font-size:12px;padding:8px 10px 8px 8px}
  .float-card .ic{width:28px;height:28px}
  .fc-appt{left:0}.fc-vax{right:0}.fc-pay{left:0;bottom:-4%}
  .day{grid-template-columns:1fr;gap:28px}
  .day::before,.day-progress{left:27px;right:auto;top:0;bottom:0;width:3px;height:auto}
  .day-progress{height:0;transition:height 1.8s cubic-bezier(.3,.7,.2,1)}
  .day.in .day-progress{width:3px;height:100%}
  .day-step{padding:0 0 0 76px;min-height:56px}
  .price-card{grid-template-columns:1fr}
  .price-main,.price-list{padding:36px 26px}
  .closing-band{padding:56px 26px;border-radius:26px;margin-top:96px}
  .peek{width:200px;right:20px;top:-80px}
  .marquee span{font-size:18px}
}
@media (max-width:520px){
  .tour-tabs{grid-template-columns:1fr}
  .price-list ul{columns:1}
  .fc-vax{top:28%}
  .phone{transform:none}
  .phone-screen{height:500px}
  .hero-note{flex-direction:column}
}
@media (prefers-reduced-motion:reduce){
  .stage-blob,.float-card,.marquee-track,.paw-trail svg,.pets *{animation:none!important}
  .js .hero h1 .line>span,.js .hero-pill,.js .hero-lead,.js .hero-actions,.js .hero-note,.js .stage,.js .float-card,.reveal,.msg{opacity:1!important;transform:none!important}
  .tour-tab .bar{display:none}
}

/* contratación */
.checkout{padding:48px 0 96px}
.checkout .wrap{display:grid;grid-template-columns:.9fr 1.1fr;gap:40px;align-items:start}
.co-summary{position:sticky;top:96px;background:var(--eira-mint);border-radius:var(--eira-radius-lg);padding:36px}
.co-summary h1{font-size:34px}
.co-summary .price-amount .num{font-size:88px}
.co-summary ul{list-style:none;padding:0;margin:24px 0 0;display:grid;gap:8px;font-size:15px}
.co-summary li{padding-left:24px;position:relative}
.co-summary li::before{content:"";position:absolute;left:2px;top:.6em;width:10px;height:6px;border-left:2px solid var(--eira-pine);border-bottom:2px solid var(--eira-pine);transform:rotate(-45deg)}
.co-pets{display:block;width:100%;max-width:340px;height:auto;margin:28px auto -36px}
.co-card{background:#fff;border:1px solid var(--eira-line);border-radius:var(--eira-radius-lg);padding:36px;box-shadow:var(--eira-shadow)}
.co-card h2{font-size:26px;margin-bottom:6px}
.co-card .lead{color:var(--eira-ink-soft);margin-bottom:26px}
.co-steps{display:flex;gap:10px;margin-bottom:26px;font-size:14px;color:var(--eira-ink-soft)}
.co-steps span{padding:6px 12px;border-radius:999px;border:1px solid var(--eira-line)}
.co-steps span.on{background:var(--eira-pine);color:#fff;border-color:var(--eira-pine)}
.fields{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.fields .full{grid-column:1/-1}
.fields label{display:block;font-weight:600;font-size:14px;margin-bottom:6px}
.fields input{width:100%;font:inherit;font-size:16px;padding:12px 14px;border:1px solid var(--eira-line);border-radius:var(--eira-radius);background:#fff;color:var(--eira-ink)}
.fields input:focus{outline:none;border-color:var(--eira-pine);box-shadow:var(--eira-focus)}
.fields small{display:block;margin-top:6px;color:var(--eira-ink-soft);font-size:13px}
.co-card .btn{width:100%;margin-top:22px}
.alert{padding:12px 14px;border-radius:var(--eira-radius);margin-bottom:18px;font-size:15px}
.alert.error{background:#fdecea;color:var(--eira-danger)}
.alert.warning{background:#fff6e0;color:#7a5200}
.co-total{display:flex;justify-content:space-between;align-items:baseline;padding:18px 0;border-block:1px solid var(--eira-line);margin-bottom:22px}
.co-total b{font-family:var(--eira-font-display);font-size:28px}
.co-secure{margin-top:18px;font-size:13px;color:var(--eira-ink-soft)}
#pay-message{margin-top:12px;font-size:14px;color:var(--eira-ink-soft)}
@media (max-width:900px){.checkout .wrap{grid-template-columns:1fr}.co-summary{position:static}.fields{grid-template-columns:1fr}.co-card{padding:26px}}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important}}

.co-terms{display:flex;gap:10px;align-items:flex-start;margin-top:18px;font-size:14px;color:var(--eira-ink-soft);line-height:1.5}
.co-terms input{margin-top:3px;width:18px;height:18px;accent-color:var(--eira-pine);flex:none}
.co-terms a{color:var(--eira-pine);font-weight:600}
/* páginas legales */
.legal{padding:56px 0 24px}
.legal-wrap{display:grid;grid-template-columns:220px minmax(0,1fr);gap:56px;align-items:start}
.legal-nav{position:sticky;top:96px;display:grid;gap:6px}
.legal-nav a{text-decoration:none;padding:10px 14px;border-radius:12px;color:var(--eira-ink-soft);font-weight:600;font-size:15px}
.legal-nav a[aria-current]{background:var(--eira-mint);color:var(--eira-pine-deep)}
.legal article{max-width:720px}
.legal h1{font-size:clamp(34px,4vw,48px);font-weight:800}
.legal-meta{margin-top:10px!important;color:var(--eira-ink-soft);font-size:15px}
.legal section{margin-top:34px}
.legal h2{font-size:21px;font-family:var(--eira-font-display)}
.legal section p{margin-top:10px;color:#2d3d50;line-height:1.75}
.legal a{color:var(--eira-pine);font-weight:600}
@media (max-width:820px){.legal-wrap{grid-template-columns:1fr;gap:24px}.legal-nav{position:static;display:flex;flex-wrap:wrap}}
/* 404 */
.notfound{min-height:62vh;display:grid;place-items:center;text-align:center;padding:48px 0}
.notfound img{width:min(320px,80%);height:auto}
.notfound h1{font-size:clamp(34px,5vw,54px);margin-top:12px!important;font-weight:800}
.notfound p{margin:12px auto 26px!important;max-width:44ch;color:var(--eira-ink-soft)}