/* iVanNutrición • Desktop fidelity refinement
   This layer intentionally removes decorative motion and makes the visuals closer
   to the supplied editorial reference. All content and controls remain HTML. */
:root {
  --ink: #14134f;
  --blue: #26216d;
  --purple: #9a3af0;
  --violet: #8750e8;
  --line: rgba(255,255,255,.92);
  --shadow: 0 7px 23px rgba(76,57,135,.10);
}
html { scroll-behavior: auto; }
body { background: #f3effe; color:var(--ink); }
.site-shell { position:relative; isolation:isolate; background: #f7f3ff; }
.site-shell::before,.site-shell::after {
  content:""; position:absolute; z-index:2; top:0; bottom:0;
  width: min(8vw,108px); pointer-events:none; opacity:.58;
  background-repeat:no-repeat; background-size:100% 100%;
}
.site-shell::before {left:0; background-image:url('assets/frame_left.jpg');}
.site-shell::after {right:0; background-image:url('assets/frame_right.jpg');}
.site-shell > header,.site-shell > main,.site-shell > footer { position:relative; z-index:3; }
.wrap {width:calc(100% - 158px);max-width:1295px;}
.scenic { background-color:#f3edfe; background-size:cover;background-position:center; }
.hero.scenic { background-image:linear-gradient(90deg,rgba(252,250,255,.30),rgba(255,255,255,.07) 50%,rgba(246,238,255,.18)),url('assets/ambient_hero.jpg'); }
.intro-band.scenic {background-image:linear-gradient(90deg,#f7f3ff8c,#f8f3ff66),url('assets/ambient_focus.jpg');}
.two-panels.scenic {background-image:linear-gradient(90deg,#f6f3ff80,#f4edff69),url('assets/ambient_topics.jpg');}
.two-panels.food-panels.scenic {background-image:linear-gradient(90deg,#f6f4ff7c,#f6f0ff78),url('assets/ambient_food.jpg');}
.plans-section.scenic {background-image:linear-gradient(90deg,#f6f1ff87,#fbf8ff69),url('assets/ambient_plans.jpg');}
.quiz-section.scenic {background-image:linear-gradient(90deg,#faf7ff6b,#f7f0ff65),url('assets/ambient_quiz.jpg');}
.booking-section.scenic {background-image:linear-gradient(90deg,#f9f7ff7d,#f4edff65),url('assets/ambient_booking.jpg');}
.scenic::before {background:linear-gradient(180deg,#ffffff12,#ffffff00 54%,#faf7ff2e);opacity:1;}
/* Realistic side architecture, soft sky and floor, without illustrated geometric peaks */
.hero::after {content:"";position:absolute;inset:auto 8% 0;height:23px;pointer-events:none;
  border-radius:50%;background:radial-gradient(ellipse,#a693ca3a,transparent 67%);}
.glass,.glass-lite {box-shadow:0 5px 25px #5f4a9c15;background:rgba(255,255,255,.72);border:1px solid rgba(255,255,255,.92);backdrop-filter:blur(17px);-webkit-backdrop-filter:blur(17px)}
.glass-lite {background:rgba(255,255,255,.76)}
button,a { -webkit-tap-highlight-color:transparent }
button,.pill,.text-link,.hero-service,.quiz-option,.focus-card,.days button {transition:background-color .14s ease,border-color .14s ease,box-shadow .14s ease,color .14s ease,filter .14s ease}
.pill:hover,.text-link:hover,.hero-service:hover {transform:none}
.pill.primary {background:linear-gradient(100deg,#b65cf4,#8f43ec 65%,#b75cfa);box-shadow:0 5px 15px #aa5bf346;}
.pill.primary:hover {background:linear-gradient(100deg,#a651ea,#8039de 65%,#a650e8);box-shadow:0 7px 17px #a452e454;filter:none;}
.pill.ghost:hover,.pill.outline:hover {background:#f3e7ff;color:#7639da;filter:none;}
.text-link {background:rgba(255,255,255,.29)}
.text-link:hover {background:#fff;transform:none;text-decoration:underline;text-underline-offset:3px}
/* Navigation: a real anchored page, not an animated set of panels */
.topbar {height:59px;background:rgba(255,255,255,.66);border-bottom:1px solid #ffffffa6;}
.topbar-inner{max-width:1190px;}
.topbar .brand {font-weight:830;letter-spacing:-.8px}
.navigation {gap:8px}
.navigation a,.navigation .nav-link{font-weight:650;color:#302668}
.navigation a:hover,.navigation a.active,.navigation .nav-link:hover{background:#e8d7ffaf;color:#6530ba}
.top-cta {padding:8px 19px;}
/* Hero reference: heading left, one protagonist in the center, two service links right */
.hero {height:392px}
.hero-inner {grid-template-columns:37% 25% 38%;max-width:1235px}
.hero-intro {padding:35px 0 0 16px;}
.hero-intro h1{font-size:52px;letter-spacing:-2.6px;line-height:1.02;max-width:490px}
.hero-intro>p:not(.eyebrow){font-size:14px;font-weight:520;max-width:365px;line-height:1.4}
.hero-woman {height:366px;width:29.7%;left:35.8%;top:-3px;object-position:50% 28%;
  mask-image:radial-gradient(ellipse 73% 70% at 49% 45%,black 63%,transparent 100%);
  -webkit-mask-image:radial-gradient(ellipse 73% 70% at 49% 45%,black 63%,transparent 100%);
  filter:drop-shadow(0 10px 24px #b785ed26)}
.hero-side {padding-left:7px;gap:9px;margin-top:0}
.hero-service{height:139px;padding:9px;gap:14px;background:rgba(255,255,255,.79);border:1px solid white;border-radius:15px}
.hero-service:hover {background:rgba(255,255,255,.94);box-shadow:0 9px 22px #815eb624}
.hero-service>img {height:117px;width:118px;object-fit:cover;}
.hero-service strong {font-size:18px}
.hero-service small {font-size:11px;line-height:1.4;max-width:190px}
.hero-service i{width:30px;height:30px;right:12px}
.hero-benefits{max-width:78%;gap:16px;background:#ffffffb6;bottom:6px;box-shadow:0 2px 13px #9385bc13}
.hero-benefits>span{font-size:10px}
/* Two wide focus panes */
.intro-band {padding:15px 0 12px}
.section-intro{margin-bottom:11px}
.section-intro h2{font-size:24px}
.section-intro p{font-size:12px}
.focus-grid{gap:12px}
.focus-card{height:197px;border-radius:14px}
.focus-card::before{background:linear-gradient(90deg,#ffffffd1,#faf1ff9c 42%,#ffffff06 95%)}
.focus-card img{width:52%;object-fit:cover;object-position:center 27%;}
.focus-card.performance-card img{width:60%;object-position:center 33%;}
.focus-content{padding-left:29px}
.focus-content h3{font-size:22px}
.focus-content p{font-size:12px}
/* Science modules: photo imagery dominates, but content is selectable text */
.two-panels{gap:9px;padding-left:max(34px,calc((100vw - 1450px)/2));padding-right:max(34px,calc((100vw - 1450px)/2))}
.topic-panel{height:330px;background:rgba(255,255,255,.48);border-radius:14px}
.topic-header h2{font-size:22px}
.topic-panel .organ-art {height:267px;width:42%;left:28%;object-position:center 18%;
  mask-image:linear-gradient(90deg,transparent,#000 14%,#000 86%,transparent)}
.topic-perf .runner-art {height:250px;left:7px;object-position:center 40%;
  mask-image:linear-gradient(90deg,#000 90%,transparent)}
.digest-info,.sibo-info,.performance-info{border-radius:13px}
.digest-info{bottom:12px}
.sibo-info{bottom:16px}
/* Food editor: compact, high contrast controls and no decorative motion */
.food-panel{height:349px;background:rgba(255,255,255,.51)}
.food-list{background:rgba(255,255,255,.78)}
.food-item{border:1px solid transparent;padding:5px 4px;color:#342f73}
.food-item[aria-pressed="true"]{background:#ede0ff!important;border-color:#d1b2f4}
.plate-stage>img{border-radius:12px;mask-image:radial-gradient(ellipse at center,#000 67%,transparent 100%)}
.plate-overlay span{background:rgba(255,255,255,.93)!important;color:#54369d!important;border:1px solid #dcc8ff}
.analysis{background:#ffffffce}
.week-tabs button{transition:background-color .14s ease,color .14s ease}
.meals,.plan-goals {background:rgba(255,255,255,.8)}
/* Pricing: editorial, consistent columns and real controls */
.plans-section{padding-top:12px;padding-bottom:15px}
.pricing-grid{gap:10px}
.pricing-card{background:rgba(255,255,255,.65);border-radius:14px;padding:15px 15px 13px}
.pricing-card.featured{background:rgba(251,248,255,.85);box-shadow:0 7px 27px #9250ed30}
.pricing-card ul{background:rgba(255,255,255,.88)}
.pricing-card li{font-size:10.5px;line-height:1.35}
.plan-top>img {mask-image:linear-gradient(90deg,transparent 0%,#000 45%);}
/* Questionnaire & calendar: visibly usable, static interface */
.quiz-section{padding:9px 0}
.quiz-layout{grid-template-columns:1.28fr .86fr 1fr}
.quiz-intro,.quiz-widget,.recommendation{background:rgba(255,255,255,.67)}
.quiz-intro>img{mask-image:linear-gradient(90deg,#000 78%,transparent);}
.quiz-option {background:rgba(255,255,255,.88)}
.quiz-option:hover,.quiz-option.selected{background:#f1e5ff;border-color:#b47af0}
.recommendation{padding:18px 17px}
.calendar {background:rgba(255,255,255,.79)}
.days button:focus-visible {outline:2px solid #964df0;outline-offset:1px}
.slots>div button:focus-visible {outline:2px solid #964df0}
.footer {background:rgba(247,244,255,.92);}
.footer-inner nav .nav-link:hover {color:#6530ba}
/* Visibility and semantics */
#inicio,#enfoques,#como-funciona,#planes,#recomendador,#reserva,#digestivo,#rendimiento {scroll-margin-top:16px;}
@media(min-width:1600px){.site-shell::before,.site-shell::after{width:105px}.two-panels{padding-left:max(30px,calc((100% - 1450px)/2));padding-right:max(30px,calc((100% - 1450px)/2))}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{animation:none!important;transition:none!important}}
/* Architectural edge details borrowed from the reference, kept outside reading columns. */
.site-shell::before,.site-shell::after {z-index:4;width:clamp(35px,3.8vw,54px);opacity:.72;mix-blend-mode:multiply}
/* Keep the architectural photograph only where the source crop is clean.
   Side gutters lower on the page contain no baked-in screenshot lettering. */
.site-shell::before,.site-shell::after{height:445px;bottom:auto;top:0;width:clamp(42px,5.7vw,82px);opacity:.80;mix-blend-mode:normal}
.site-shell::before{background-image:url('assets/hero_edge_left.jpg')}
.site-shell::after{background-image:url('assets/hero_edge_right.jpg')}