/* Paleta elegida por Jennifer. Cada tono secundario deriva de estos cinco colores. */
:root {
  --paper:#FFFFFF;
  --white:#FFFFFF;
  --ink:#17221C;
  --green:#16834B;
  --green-dark:#17221C;
  --lime:#C8F65A;
  --mint:#EAF7EF;
  --orange:#16834B;
  --muted:#59665E;
  --line:#DEE9E1;
  --shadow-soft:0 8px 28px rgb(23 34 28 / 5%);
  --shadow-raised:0 18px 45px rgb(23 34 28 / 10%);
  --ease-stride:cubic-bezier(.2,.8,.2,1);
}

::selection { background:var(--lime); color:var(--ink); }
.review-bar { background:var(--mint); color:#3E5A47; }
.status-dot { background:var(--green); box-shadow:0 0 0 3px rgb(22 131 75 / 8%); }
.site-header { border-bottom-color:rgb(22 131 75 / 8%); box-shadow:0 5px 22px rgb(23 34 28 / 3%); }
.brand { color:var(--ink); }
.reading-track { position:absolute; bottom:-1px; left:0; right:0; height:3px; overflow:hidden; pointer-events:none; }
.reading-track span { display:block; width:100%; height:100%; background:linear-gradient(90deg,var(--green),var(--lime)); transform:scaleX(0); transform-origin:left; }
.hero { position:relative; isolation:isolate; }
.hero::before { content:''; position:absolute; inset:0; background:radial-gradient(ellipse at 9% 13%,rgb(234 247 239 / 85%),transparent 50%),radial-gradient(ellipse at 95% 74%,rgb(200 246 90 / 10%),transparent 35%); pointer-events:none; z-index:-1; }
.hero .eyebrow { background:linear-gradient(120deg,var(--mint),#F6FCEB); border:1px solid rgb(22 131 75 / 9%); color:#24653F; border-radius:999px; padding:9px 14px; font-size:9px; }
.hero h1 em { color:var(--green); background:linear-gradient(120deg,#16834B 15%,#12683C 80%); background-clip:text; -webkit-background-clip:text; -webkit-text-fill-color:transparent; }
.hero-description { font-size:15px; }
.hero-photo { border-radius:22px; box-shadow:0 22px 65px rgb(23 34 28 / 17%),0 4px 12px rgb(23 34 28 / 8%); }
.editorial-photo img { transition:transform 900ms var(--ease-stride); }
.editorial-photo::after { background:linear-gradient(180deg,rgb(23 34 28 / 5%) 25%,rgb(23 34 28 / 4%) 45%,rgb(23 34 28 / 90%)); }
.photo-topline { background:rgb(255 255 255 / 94%); border:1px solid rgb(255 255 255 / 80%); color:var(--ink); border-radius:999px; padding:9px 13px; box-shadow:0 4px 15px rgb(23 34 28 / 9%); }
.photo-bottomline { z-index:2; font-size:clamp(32px,3.4vw,47px); }
.pace-note { padding:19px 23px; border-radius:14px; background:linear-gradient(120deg,#D9FC94,var(--lime)); box-shadow:0 12px 30px rgb(23 34 28 / 15%),inset 0 1px 0 rgb(255 255 255 / 65%); color:var(--ink); }
.pace-note>span { color:var(--ink); }
.hero-footnote { font-size:11px; }
.tiny-sun { background:var(--mint); color:var(--green); box-shadow:0 0 0 4px rgb(234 247 239 / 65%); }
.principles-strip { background:linear-gradient(90deg,#FFFFFF,var(--mint),#FFFFFF); box-shadow:0 3px 15px rgb(23 34 28 / 2%); }
.principles-strip>span:nth-child(even) { color:var(--green); }

/* Botones amplios, con una salida hacia adelante al interactuar. */
.button {
  position:relative;
  isolation:isolate;
  overflow:hidden;
  min-height:66px;
  padding:15px 21px 15px 27px;
  gap:25px;
  border-radius:999px;
  background:linear-gradient(120deg,#23372A,var(--ink) 75%);
  color:var(--lime);
  border:1px solid rgb(23 34 28 / 85%);
  font-size:15px;
  font-weight:600;
  box-shadow:0 8px 20px rgb(23 34 28 / 14%),inset 0 1px 0 rgb(255 255 255 / 8%);
  transition:transform 350ms var(--ease-stride),box-shadow 350ms var(--ease-stride),background-position 400ms;
  background-size:160% 100%;
}
.button>span { display:inline-flex; align-items:center; justify-content:center; width:36px; height:36px; flex-shrink:0; border-radius:100%; font-size:25px; line-height:1; color:var(--lime); transition:transform 500ms var(--ease-stride); }
.button::after { content:''; position:absolute; left:28px; right:27px; bottom:9px; height:1px; background:repeating-linear-gradient(90deg,transparent 0 4px,rgb(200 246 90 / 55%) 4px 11px); transform:scaleX(0); transform-origin:left; opacity:0; pointer-events:none; }
.button:hover { background:linear-gradient(120deg,#235A36,var(--ink) 85%); transform:translateY(-4px); box-shadow:0 15px 30px rgb(22 131 75 / 22%); }
.button:hover>span { transform:translateX(7px); }
.button:hover::after { animation:button-stride 750ms var(--ease-stride) both; }
.button:active { transform:translateY(0) scale(.985); box-shadow:0 4px 10px rgb(23 34 28 / 15%); transition-duration:100ms; }
.button:focus-visible { outline:3px solid var(--green); outline-offset:5px; }
.button-small { min-height:52px; padding:8px 15px 8px 22px; font-size:13px; gap:18px; }
.button-small>span { width:30px; height:30px; font-size:22px; }
.text-link { min-height:44px; align-items:center; border-bottom-color:rgb(22 131 75 / 35%); padding-block:6px; transition:color 250ms, gap 350ms var(--ease-stride); }
.text-link:hover { color:var(--green); gap:21px; }

/* Un pequeño recorrido que se dibuja: movimiento finito, sin bucles al leer. */
.running-route { position:absolute; bottom:35px; right:22px; width:160px; height:auto; opacity:.95; z-index:1; pointer-events:none; }
.route-base { stroke:rgb(234 247 239 / 28%); stroke-width:2; stroke-linecap:round; stroke-dasharray:3 6; }
.route-draw { stroke:url(#route-gradient); stroke-width:3; stroke-linecap:round; stroke-dasharray:1; stroke-dashoffset:0; }
.route-start { fill:var(--mint); }
.route-finish { fill:var(--lime); }
.route-finish-halo { fill:rgb(200 246 90 / 17%); transform-box:fill-box; transform-origin:center; }
.motion-ready .route-draw { stroke-dashoffset:1; }
.motion-ready .hero-visual.in-view .route-draw { animation:route-arrival 1700ms 400ms var(--ease-stride) both; }
.motion-ready .hero-visual.in-view .route-finish-halo { animation:finish-step 900ms 1600ms ease-out 2 both; }

.recognition { background:linear-gradient(145deg,var(--mint),#F7FBF8 60%,#FFFFFF); }
.recognition h2 em,.about-heading h2 em,.section-heading h2 em,.video-section h2 em,.faq h2 em { color:var(--green); }
.recognition-list article,.recognition-list article:last-child { border-color:rgb(22 131 75 / 8%); background:linear-gradient(145deg,#FFFFFF,#FCFFFD); box-shadow:var(--shadow-soft),inset 0 1px 0 #FFFFFF; border-radius:15px; padding:26px; }
.list-number { background:var(--mint); color:var(--green); border:1px solid rgb(22 131 75 / 9%); border-radius:9px; min-width:32px; height:32px; }
.recognition-list h3 { font-size:18px; }
.recognition-list p { font-size:14px; }
.about { position:relative; }
.about-copy .lead { color:var(--ink); }
.credentials { background:linear-gradient(100deg,var(--mint),#FAFDFA); border:1px solid rgb(22 131 75 / 8%); border-radius:15px; padding:25px 24px; box-shadow:0 6px 20px rgb(22 131 75 / 4%); }
.credentials>div+div { border-left-color:rgb(22 131 75 / 15%); }
.credentials strong { color:var(--ink); }
.steps { position:relative; padding-top:5px; }
.steps article,.steps article+article { border:1px solid rgb(22 131 75 / 10%); border-radius:17px; padding:28px 26px; background:linear-gradient(155deg,#FFFFFF,#F9FDF9); box-shadow:var(--shadow-soft); position:relative; overflow:hidden; }
.steps article::before { content:''; position:absolute; top:0; left:0; right:0; height:3px; background:linear-gradient(90deg,var(--green),var(--lime)); transform:scaleX(1); transform-origin:left; }
.motion-ready .steps article::before { transform:scaleX(0); }
.motion-ready .steps article.in-view::before { animation:step-track 800ms 300ms var(--ease-stride) both; }
.step-number { color:var(--green); font-size:13px; }
.step-number>span { color:var(--green); background:var(--mint); width:30px; height:30px; display:grid; place-items:center; border-radius:100%; }
.steps p { font-size:14px; }
.program { background:radial-gradient(ellipse at 100% 0%,rgb(22 131 75 / 40%),transparent 57%),linear-gradient(120deg,#17221C,#1C3426); border-radius:24px; box-shadow:0 20px 55px rgb(23 34 28 / 17%); position:relative; overflow:hidden; isolation:isolate; border:1px solid rgb(22 131 75 / 24%); }
.program::after { content:''; position:absolute; inset:0; background:linear-gradient(125deg,transparent 72%,rgb(234 247 239 / 4%) 72%,rgb(234 247 239 / 4%) 72.2%,transparent 72.2%,transparent 77%,rgb(234 247 239 / 4%) 77%,rgb(234 247 239 / 4%) 77.2%,transparent 77.2%,transparent 82%,rgb(234 247 239 / 4%) 82%,rgb(234 247 239 / 4%) 82.2%,transparent 82.2%); z-index:-1; pointer-events:none; }
.program .eyebrow { color:var(--lime); }
.program .button { background:linear-gradient(110deg,#D9FB94,var(--lime)); color:var(--ink); border-color:rgb(200 246 90 / 70%); box-shadow:0 9px 25px rgb(200 246 90 / 9%); }
.program .button:hover { background:linear-gradient(110deg,#E1FFA9,#C8F65A); box-shadow:0 15px 35px rgb(200 246 90 / 15%); }
.program .button>span { color:var(--ink); }
.program .button::after { background:repeating-linear-gradient(90deg,transparent 0 4px,rgb(23 34 28 / 40%) 4px 11px); }
.program-details>div { border-bottom-color:rgb(234 247 239 / 15%); }
.feature-icon { background:linear-gradient(145deg,rgb(234 247 239 / 10%),rgb(234 247 239 / 3%)); border-color:rgb(200 246 90 / 17%); color:var(--lime); box-shadow:inset 0 1px 0 rgb(255 255 255 / 7%); border-radius:10px; width:38px; height:38px; }
.program-copy>p:not(.eyebrow),.program-details p { color:#D3E2D7; }
.video-placeholder { background:radial-gradient(ellipse at 0% 0%,#FFFFFF,transparent 70%),linear-gradient(135deg,var(--mint),#E3F2E5); border:1px solid rgb(22 131 75 / 10%); border-radius:20px; box-shadow:var(--shadow-soft); }
.video-pattern { background:linear-gradient(120deg,transparent 60%,rgb(22 131 75 / 10%) 60%,rgb(22 131 75 / 10%) 60.4%,transparent 60.4%,transparent 68%,rgb(22 131 75 / 10%) 68%,rgb(22 131 75 / 10%) 68.4%,transparent 68.4%); }
.video-frame { color:var(--green); }
.video-placeholder>.eyebrow { color:#3C6E4F; }
.faq-list { border-top:0; display:flex; flex-direction:column; gap:10px; }
.faq details { background:#FFFFFF; border:1px solid rgb(22 131 75 / 9%); border-radius:13px; padding-inline:21px; box-shadow:0 4px 15px rgb(23 34 28 / 3%); }
.faq details[open] { background:linear-gradient(120deg,#FFFFFF,#F5FBF7); box-shadow:0 9px 24px rgb(22 131 75 / 7%); border-color:rgb(22 131 75 / 18%); }
.faq summary { gap:20px; padding-block:23px; }
.faq summary>span { display:grid; place-items:center; min-width:28px; height:28px; border-radius:100%; background:var(--mint); color:var(--green); transition:transform 250ms var(--ease-stride); }
.faq details[open] p { animation:answer-arrival 300ms ease-out both; }
.contact { background:radial-gradient(ellipse at 95% 4%,rgb(200 246 90 / 42%),transparent 50%),linear-gradient(135deg,var(--mint),#F7FCF9 70%,#FFFFFF); color:var(--ink); border:1px solid rgb(22 131 75 / 12%); border-radius:25px; box-shadow:0 18px 50px rgb(22 131 75 / 9%); }
.contact-star { color:var(--lime); background:linear-gradient(135deg,var(--green),var(--ink)); box-shadow:0 9px 20px rgb(22 131 75 / 15%); width:57px; height:57px; font-size:31px; }
.contact .eyebrow { color:#3C6849; }
.contact h2 em { color:var(--green); }
.contact>p:not(.eyebrow) { color:#4E6556; }
.contact .button { min-height:68px; font-size:15px; padding-inline:29px 23px; }
.contact-caption { color:#4E6556; }
.site-footer .brand { color:var(--ink); }
dialog { border:1px solid rgb(22 131 75 / 13%); border-radius:22px; box-shadow:0 30px 100px rgb(23 34 28 / 25%); }
dialog::backdrop { background:rgb(23 34 28 / 55%); backdrop-filter:blur(8px); }
dialog h2 em { color:var(--green); }
.dialog-note { background:var(--mint); color:#3D654B; border-radius:9px; }
.close-dialog:not(.button) { min-width:44px; min-height:44px; background:#FFFFFF; }
.close-dialog:not(.button):hover { background:var(--mint); }
textarea { border-color:#B7D9C5; box-shadow:inset 0 2px 5px rgb(22 131 75 / 3%); }

/* Solo la mejora progresiva oculta brevemente los elementos que van a entrar. */
.motion-ready .reveal { opacity:0; transform:translateY(24px); transition:opacity 700ms var(--ease-stride),transform 700ms var(--ease-stride); transition-delay:var(--reveal-delay,0ms); }
.motion-ready .reveal.in-view { opacity:1; transform:translateY(0); }
.motion-ready .hero-visual.reveal { transform:translateY(26px) scale(.985); }
.motion-ready .hero-visual.reveal.in-view { transform:translateY(0) scale(1); }

@keyframes button-stride { 0%{transform:scaleX(0);opacity:0} 25%{opacity:1} 100%{transform:scaleX(1);opacity:.7} }
@keyframes route-arrival { from{stroke-dashoffset:1} to{stroke-dashoffset:0} }
@keyframes finish-step { 0%,100%{transform:scale(1);opacity:.6} 55%{transform:scale(1.55);opacity:.15} }
@keyframes step-track { from{transform:scaleX(0)} to{transform:scaleX(1)} }
@keyframes answer-arrival { from{opacity:.2;transform:translateY(-5px)} to{opacity:1;transform:translateY(0)} }
@media(hover:hover) and (pointer:fine) { .hero-photo:hover img { transform:scale(1.025); } }
@media(max-width:1100px) and (min-width:761px) {
  .hero .button { min-height:64px; font-size:13px; padding-inline:23px 18px; }
  .hero-actions { gap:19px; }
  .hero-description { font-size:14px; }
  .hero .text-link { font-size:12px; }
  .hero-actions>.text-link { flex-basis:fit-content; }
  .running-route { width:125px; right:18px; bottom:31px; }
  .pace-note { padding:17px 19px; }
  .credentials { padding:22px 18px; gap:21px; }
  .credentials>div+div { padding-left:20px; }
  .credentials strong { font-size:22px; }
  .steps article,.steps article+article { padding:25px 21px; }
}
@media(max-width:760px) {
  .site-header { padding-block:16px; }
  .menu-toggle { width:46px; height:46px; border-radius:12px; border-color:rgb(22 131 75 / 16%); background:linear-gradient(130deg,#FFFFFF,var(--mint)); box-shadow:0 3px 10px rgb(22 131 75 / 4%); }
  .hero .eyebrow { font-size:8px; letter-spacing:.07em; padding:9px 12px; }
  .hero-description { font-size:14px; }
  .hero .button,.program .button { min-height:64px; font-size:14px; padding:14px 20px 14px 25px; }
  .hero-actions { gap:13px; }
  .hero-actions>.button { width:100%; justify-content:space-between; }
  .hero-actions>.text-link { min-height:45px; margin-inline:auto; font-size:12px; }
  .hero-footnote { font-size:10px; }
  .hero-photo { border-radius:18px; box-shadow:0 13px 35px rgb(23 34 28 / 15%); }
  .photo-topline { font-size:7px; padding:8px 10px; }
  .photo-bottomline { font-size:33px; }
  .pace-note { right:-3px; border-radius:11px; padding:15px 17px; font-size:11px; }
  .running-route { width:120px; right:12px; bottom:27px; }
  .button-small { min-height:52px; }
  .button { min-height:60px; font-size:14px; padding:13px 21px 13px 25px; }
  .button>span { width:34px; height:34px; font-size:25px; }
  .recognition-list article,.recognition-list article:last-child { padding:23px 20px; border-radius:14px; }
  .recognition-list h3 { font-size:16px; }
  .recognition-list p { font-size:14px; }
  .list-number { min-width:28px; height:28px; border-radius:8px; }
  .credentials { border-radius:14px; gap:23px; padding:23px 18px; }
  .credentials>div+div { padding-left:22px; }
  .credentials strong { font-size:23px; }
  .credentials span { font-size:9px; }
  .steps article,.steps article+article { padding:26px 23px; border-radius:16px; }
  .program { border-radius:20px; padding:34px 25px; box-shadow:0 14px 35px rgb(23 34 28 / 16%); }
  .program .button { width:100%; justify-content:space-between; }
  .program-details p { font-size:13px; }
  .feature-icon { width:35px; height:35px; }
  .video-placeholder { border-radius:17px; }
  .faq details { padding-inline:17px; border-radius:12px; }
  .faq summary { font-size:14px; gap:14px; padding-block:21px; }
  .faq details p { font-size:13px; padding-right:0; }
  .contact { padding:44px 23px 43px; border-radius:20px; }
  .contact .button { min-height:66px; width:100%; max-width:320px; justify-content:space-between; padding-inline:22px 18px; font-size:14px; }
  .contact-caption { font-size:7px; }
  .contact-star { width:52px; height:52px; font-size:29px; }
  dialog { border-radius:18px; }
  dialog>.button { width:100%; justify-content:space-between; }
  .motion-ready .reveal { transform:translateY(17px); transition-duration:600ms; }
}
@media(max-width:380px) {
  .hero .eyebrow { font-size:7px; }
  .hero .button,.program .button { font-size:13px; padding-inline:22px 18px; }
  .hero-footnote { font-size:9px; }
  .credentials { gap:16px; padding-inline:15px; }
  .credentials>div+div { padding-left:16px; }
  .credentials strong { font-size:20px; }
  .credentials span { font-size:8px; }
  .program { padding-inline:22px; }
  .contact { padding-inline:20px; }
  .contact .button { font-size:13px; }
  .running-route { width:105px; }
}
@media(prefers-reduced-motion:reduce) {
  html:not([data-motion="full"]) { scroll-behavior:auto; }
  html:not([data-motion="full"]) *,html:not([data-motion="full"]) *::before,html:not([data-motion="full"]) *::after { animation:none!important; transition:none!important; }
  html:not([data-motion="full"]) .reveal,html:not([data-motion="full"]) .hero-visual.reveal { opacity:1; transform:none; }
  html:not([data-motion="full"]) .route-draw { stroke-dashoffset:0; }
  html:not([data-motion="full"]) .steps article::before { transform:scaleX(1); }
  html:not([data-motion="full"]) .button:hover,html:not([data-motion="full"]) .button:hover>span,html:not([data-motion="full"]) .button:active,html:not([data-motion="full"]) .hero-photo:hover img { transform:none; }
}
@media print {
  .reading-track { display:none; }
  .motion-ready .reveal,.motion-ready .hero-visual.reveal { opacity:1; transform:none; }
  .motion-ready .route-draw { stroke-dashoffset:0; }
  .hero h1 em { -webkit-text-fill-color:var(--green); }
}
