/* The House of Routing — estilos de página */
.thor-mount{display:contents}
body{margin:0;background:#06111F}
a{color:#8DAEDB}a:hover{color:#F1F5FA}
.thor-rc-tecnologia .thor-rc-pilar{color:var(--pilar-tecnologia)}.thor-rc-negocio .thor-rc-pilar{color:var(--pilar-negocio)}.thor-rc-persona .thor-rc-pilar{color:var(--pilar-persona)}
@keyframes thor-led{0%,100%{opacity:1}50%{opacity:.25}}
@keyframes thor-halo{0%{transform:scale(1);opacity:.7}100%{transform:scale(2.8);opacity:0}}
@keyframes thor-sweep{0%{transform:translateX(-120%)}60%,100%{transform:translateX(320%)}}
.status-led{animation:thor-led 1.4s ease-in-out infinite}
.status-halo{animation:thor-halo 1.4s ease-out infinite}
.status-sweep{animation:thor-sweep 3.2s ease-in-out infinite}
.status-led-slow{animation:thor-led 2.4s ease-in-out infinite}
.tr-card{transition:translate .25s ease,border-color .25s ease}.tr-card:hover{translate:0 -4px}
.tr-w{display:inline-block}
@keyframes tr-rise{from{opacity:0;transform:translateY(.45em);filter:blur(6px)}to{opacity:1;transform:none;filter:none}}
@keyframes tr-shine{0%{background-position:200% 0}100%{background-position:-200% 0}}
@keyframes tr-type{from{clip-path:inset(0 100% 0 0)}to{clip-path:inset(0 0 0 0)}}
@keyframes tr-pop{from{opacity:0;transform:translateY(24px)}to{opacity:1;transform:none}}
@supports (animation-timeline: view()){
#traccion .tr-w{animation:tr-rise .7s cubic-bezier(.2,.7,.2,1) both;animation-timeline:view();animation-range:entry 10% cover 30%}
#traccion .tr-w:nth-child(1){animation-range:entry 10% cover 28%}#traccion .tr-w:nth-child(2){animation-range:entry 17% cover 35%}#traccion .tr-w:nth-child(3){animation-range:entry 24% cover 42%}#traccion .tr-w:nth-child(4){animation-range:entry 31% cover 49%}#traccion .tr-w:nth-child(5){animation-range:entry 38% cover 56%}
#traccion .tr-type{animation:tr-type linear both;animation-timeline:view();animation-range:entry 0% cover 25%}
#traccion .tr-card{animation:tr-pop linear both;animation-timeline:view();animation-range:entry 0% cover 30%}
}
#traccion .tr-num{background:linear-gradient(100deg,currentColor 40%,#FFFFFF 50%,currentColor 60%);background-size:200% 100%;-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;animation:tr-shine 4s linear infinite}
@media (prefers-reduced-motion:reduce){#traccion .tr-w,#traccion .tr-type,#traccion .tr-card,#traccion .tr-num{animation:none!important;clip-path:none;opacity:1;transform:none;filter:none}#traccion .tr-num{-webkit-text-fill-color:currentColor}}
@keyframes agle-pulse{0%,100%{transform:none;text-shadow:none;color:var(--route-text)}6%{transform:translateY(-6px) scale(1.12);text-shadow:0 0 18px #F0503A99,0 0 2px #F5654F;color:#FF8A75}14%{transform:none;text-shadow:0 0 8px #F0503A55;color:var(--route-text)}24%{text-shadow:none}}
@keyframes agle-in{from{opacity:0;transform:translateY(28px) scale(.6);filter:blur(8px)}to{opacity:1;transform:none;filter:none}}
.agle-l{display:inline-block;animation:agle-pulse 4.8s ease-in-out infinite;animation-delay:calc(var(--i) * 1.2s)}
.agle-card{transition:translate .25s ease,border-color .25s ease}.agle-card:hover{translate:0 -4px;border-color:var(--route)!important}
@supports (animation-timeline: view()){.agle-card{animation:agle-in linear both;animation-timeline:view();animation-range:entry 0% cover 30%}}
@media (prefers-reduced-motion:reduce){.agle-l,.agle-card{animation:none!important;opacity:1;transform:none;filter:none}}
.fd-route{stroke-dasharray:1;stroke-dashoffset:1;animation:fd-draw 6s cubic-bezier(.65,0,.35,1) infinite}
.fd-b,.fd-b-halo{transform-box:fill-box;transform-origin:center}
.fd-b{animation:fd-b 6s ease-out infinite}
.fd-b-halo{animation:fd-halo 6s ease-out infinite}
@keyframes fd-draw{0%{stroke-dashoffset:1;opacity:1}40%{stroke-dashoffset:0;opacity:1}82%{stroke-dashoffset:0;opacity:1}94%,100%{stroke-dashoffset:0;opacity:0}}
@keyframes fd-b{0%,38%{opacity:0;transform:scale(.2)}44%{opacity:1;transform:scale(1.25)}52%{transform:scale(1)}82%{opacity:1;transform:scale(1)}94%,100%{opacity:0;transform:scale(1)}}
@keyframes fd-halo{0%,40%{opacity:0;transform:scale(1)}44%{opacity:.8;transform:scale(1)}72%,100%{opacity:0;transform:scale(3.2)}}
@media (prefers-reduced-motion:reduce){.fd-route,.fd-b,.fd-b-halo{animation:none!important}.fd-route{stroke-dashoffset:0}.fd-b{opacity:1}.fd-b-halo{display:none}}
.soc-ic{transition:translate .2s ease,transform .2s ease,border-color .2s ease,box-shadow .2s ease,color .2s ease;animation:soc-wave 6s ease-in-out infinite;animation-delay:calc(var(--i) * .22s)}
.soc-ic svg{transition:transform .2s ease}
.soc-ic:hover,.soc-ic:focus-visible{animation:none;translate:0 -6px;border-color:var(--route)!important;color:var(--route-text)!important;box-shadow:var(--glow-route)}
.soc-ic:hover svg{transform:scale(1.15)}
@keyframes soc-wave{0%,100%{transform:none;border-color:var(--line-strong);box-shadow:none}6%{transform:translateY(-8px);border-color:var(--route);box-shadow:var(--glow-route)}12%{transform:none;border-color:var(--line-strong);box-shadow:none}16%{transform:translateY(-2px)}20%{transform:none}}
@keyframes soc-in{from{opacity:0;transform:translateY(20px) scale(.7)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion:reduce){.soc-ic{animation:none!important}.soc-ic:hover{translate:none}}
@property --plan-ang{syntax:"<angle>";inherits:false;initial-value:0deg}
.plan-border{background:conic-gradient(from var(--plan-ang),#8A6418 0deg,#C29A3A 60deg,#FFF1C7 90deg,#DDB963 110deg,#8A6418 170deg,#8A6418 180deg,#C29A3A 240deg,#FFF1C7 270deg,#DDB963 290deg,#8A6418 350deg)!important;animation:plan-spin 7s linear infinite}
.plan-wrap{transition:transform .3s ease,filter .3s ease;filter:drop-shadow(0 0 0 transparent)}
.plan-wrap:hover{transform:translateY(-6px);filter:drop-shadow(0 0 22px #DDB96359) drop-shadow(0 14px 28px #00000080)}
.plan-wrap:hover .plan-border{animation-duration:2.5s}
@keyframes plan-spin{to{--plan-ang:360deg}}
@media (prefers-reduced-motion:reduce){.plan-border{animation:none!important}.plan-wrap:hover{transform:none}}
.thor-rc-tecnologia{--pc:var(--pilar-tecnologia)}.thor-rc-negocio{--pc:var(--pilar-negocio)}.thor-rc-persona{--pc:var(--pilar-persona)}
.rc-node .thor-rc{transition:transform .25s ease,filter .25s ease}
.rc-node .thor-rc-frame{background:linear-gradient(90deg,var(--line) 0 38%,var(--pc) 50%,var(--line) 62% 100%);background-size:300% 100%;background-position:100% 0;animation:rc-signal 10.8s linear infinite;animation-delay:calc(var(--i) * 0.9s)}
@keyframes rc-signal{0%{background-position:100% 0}9%{background-position:0% 0}100%{background-position:0% 0}}
.rc-node .thor-rc:hover{transform:translateY(-6px);filter:drop-shadow(0 0 14px color-mix(in srgb,var(--pc) 45%,transparent))}
.rc-node .thor-rc:hover .thor-rc-frame{background:var(--pc);animation:none}
.rc-node .thor-hexicon{transform-origin:center}.rc-node .thor-rc:hover .thor-hexicon{animation:rc-wiggle .6s ease}
@keyframes rc-wiggle{0%{transform:none}30%{transform:rotate(-14deg) scale(1.12)}60%{transform:rotate(10deg) scale(1.12)}100%{transform:none}}
@keyframes rc-in{from{opacity:0;transform:translateY(32px) scale(.94)}to{opacity:1;transform:none}}
@supports (animation-timeline: view()){.rc-node{animation:rc-in linear both;animation-timeline:view()}.rc-node:nth-child(4n+1){animation-range:entry 0% cover 22%}.rc-node:nth-child(4n+2){animation-range:entry 8% cover 30%}.rc-node:nth-child(4n+3){animation-range:entry 16% cover 38%}.rc-node:nth-child(4n+4){animation-range:entry 24% cover 46%}}
@media (prefers-reduced-motion:reduce){.rc-node,.rc-node .thor-rc-frame,.rc-node .thor-hexicon{animation:none!important}.rc-node .thor-rc-frame{background:var(--line)}.rc-node .thor-rc:hover{transform:none}}
@media (prefers-reduced-motion:reduce){.status-led,.status-led-slow,.status-halo,.status-sweep{animation:none}.status-halo,.status-sweep{display:none}}

/* El momento es ahora: barras de progreso y cuenta regresiva */
.mo-card{transition:translate .25s ease,border-color .25s ease,box-shadow .25s ease}
.mo-card:hover{translate:0 -4px;border-color:var(--brand)!important}
.mo-card-route:hover{border-color:var(--route)!important;box-shadow:var(--glow-route)}
.mo-bar{height:6px;border-radius:3px;background:var(--line);overflow:hidden;margin:4px 0 6px}
.mo-bar span{display:block;height:100%;width:var(--v);border-radius:3px;background:linear-gradient(90deg,var(--brand),var(--focus));transition:width 1.8s cubic-bezier(.16,1,.3,1),box-shadow .25s ease}
.js #momento:not(.is-on) .mo-bar span{width:0}
.mo-card:hover .mo-bar span{box-shadow:0 0 12px #8DAEDB99}
.mo-days{display:none;margin:2px 0 4px;align-items:center;gap:8px;font-family:var(--font-mono);font-size:14px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--route-text)}
.js .mo-days{display:inline-flex}
.mo-days [data-days]{font-variant-numeric:tabular-nums}
.mo-dot{width:8px;height:8px;border-radius:50%;background:var(--route);animation:thor-led 1.4s ease-in-out infinite}
@media (prefers-reduced-motion:reduce){.mo-bar span{transition:none}.mo-dot{animation:none}.mo-card:hover{translate:none}}

/* Botones del hero: brillo que recorre, flecha que avanza y halo al pasar el mouse */
.hero-ctas .thor-btn{transition:translate .25s ease,filter .25s ease}
.hero-ctas .thor-btn:hover{translate:0 -2px;filter:drop-shadow(0 8px 18px rgba(240,80,58,.45))}
.hero-ctas .thor-btn:hover .thor-btn-icon{transform:translateX(6px)}
.hero-ctas .thor-btn-bg{overflow:hidden}
.hero-ctas .thor-btn-bg::after{content:"";position:absolute;inset:0;background:linear-gradient(105deg,transparent 30%,rgba(255,255,255,.3) 50%,transparent 70%);transform:translateX(-130%);animation:hero-shine 5s ease-in-out infinite}
.hero-ctas .thor-btn-icon svg{animation:hero-nudge 5s ease-in-out infinite}
.hero-ctas > :nth-child(2) .thor-btn-bg::after,.hero-ctas > :nth-child(2) .thor-btn-icon svg{animation-delay:1.5s}
@keyframes hero-shine{0%{transform:translateX(-130%)}22%,100%{transform:translateX(130%)}}
@keyframes hero-nudge{0%,20%{transform:none}25%{transform:translateX(4px)}31%,100%{transform:none}}
@media (prefers-reduced-motion:reduce){.hero-ctas .thor-btn-bg::after{display:none}.hero-ctas .thor-btn-icon svg{animation:none}.hero-ctas .thor-btn:hover{translate:none}}

/* Tres pilares: el isotipo explicado */
.pilares{margin:0;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.05fr);gap:56px;align-items:center;padding:40px;border:1px solid var(--line);border-radius:8px;background:var(--surface-raised)}
@media (max-width:860px){.pilares{grid-template-columns:1fr;gap:32px;padding:28px 20px}}
.pilares-art{display:flex;justify-content:center}
.pilares-svg{width:100%;max-width:440px;height:auto;overflow:visible}
.pl-hex{stroke-width:2.2;stroke-dasharray:1;stroke-dashoffset:0;fill-opacity:.1;transition:fill-opacity .3s ease,stroke-width .3s ease,filter .3s ease}
.pl-hex-tec{stroke:var(--pilar-tecnologia);fill:var(--pilar-tecnologia)}
.pl-hex-neg{stroke:var(--pilar-negocio);fill:var(--pilar-negocio)}
.pl-hex-per{stroke:var(--pilar-persona);fill:var(--pilar-persona)}
.pl-lab{font-family:var(--font-mono);font-size:3.2px;font-weight:700;letter-spacing:.14em;text-anchor:middle}
.pl-lab-tec{fill:var(--pilar-tecnologia)}.pl-lab-neg{fill:var(--pilar-negocio)}.pl-lab-per{fill:var(--pilar-persona)}
.pl-route{stroke:var(--route);stroke-width:2.4;stroke-dasharray:1;stroke-dashoffset:0;filter:drop-shadow(0 0 1.2px rgba(240,80,58,.55))}
.pl-node{fill:var(--route)}
.pl-node-b{transform-box:fill-box;transform-origin:center}
.pl-wave{fill:none;stroke:var(--route);stroke-width:.8;opacity:0;transform-box:fill-box;transform-origin:center}
.pl-packet{fill:#FFFFFF;opacity:0}
.pl-ab{font-family:var(--font-mono);font-size:4.4px;font-weight:700;fill:var(--route-text)}
.pilares-copy{display:flex;flex-direction:column;gap:14px}
.pilares-eyebrow{margin:0;font-family:var(--font-mono);font-size:12px;font-weight:600;letter-spacing:.14em;color:var(--route-text)}
.pilares-h{margin:0;font-family:var(--font-display);font-size:30px;line-height:1.15;font-weight:700;letter-spacing:-.015em;color:var(--ink)}
.pilares-lead{margin:0;font-size:16px;line-height:26px;color:var(--ink-muted)}
.pilares-list{list-style:none;margin:4px 0 0;padding:0;display:flex;flex-direction:column;gap:10px}
.pilares-list li{display:flex;gap:14px;align-items:flex-start;padding:12px 14px;border:1px solid var(--line);border-radius:6px;background:var(--surface);transition:border-color .25s ease,translate .25s ease}
.pilares-list li div{display:flex;flex-direction:column;gap:2px}
.pilares-list b{font-family:var(--font-display);font-size:16px;font-weight:600;color:var(--ink)}
.pilares-list li span:not(.pl-dot){font-size:14px;line-height:22px;color:var(--ink-muted)}
.pl-dot{flex:none;width:12px;height:12px;margin-top:5px;clip-path:polygon(50% 0,100% 25%,100% 75%,50% 100%,0 75%,0 25%)}
.pl-dot-tec{background:var(--pilar-tecnologia)}.pl-dot-neg{background:var(--pilar-negocio)}.pl-dot-per{background:var(--pilar-persona)}
.pilares-list li[data-p=tec]:hover,.pilares.hl-tec li[data-p=tec]{border-color:var(--pilar-tecnologia);translate:4px 0}
.pilares-list li[data-p=neg]:hover,.pilares.hl-neg li[data-p=neg]{border-color:var(--pilar-negocio);translate:4px 0}
.pilares-list li[data-p=per]:hover,.pilares.hl-per li[data-p=per]{border-color:var(--pilar-persona);translate:4px 0}
.pilares.hl-tec .pl-hex-tec,.pilares.hl-neg .pl-hex-neg,.pilares.hl-per .pl-hex-per{fill-opacity:.28;stroke-width:3;filter:drop-shadow(0 0 4px currentColor)}
.pilares-note{margin:4px 0 0;padding-left:14px;border-left:2px solid var(--route);font-size:14px;line-height:22px;color:var(--ink-muted)}
/* Secuencia al entrar en pantalla */
.js .pilares:not(.is-on) .pl-hex{stroke-dashoffset:1;fill-opacity:0}
.js .pilares:not(.is-on) .pl-lab,.js .pilares:not(.is-on) .pilares-list li{opacity:0}
.pilares.is-on .pl-hex{animation:pl-draw 900ms cubic-bezier(.65,0,.35,1) both,pl-fill 600ms ease both}
.pilares.is-on .pl-hex-tec{animation-delay:0ms,700ms}.pilares.is-on .pl-hex-neg{animation-delay:350ms,1050ms}.pilares.is-on .pl-hex-per{animation-delay:700ms,1400ms}
.pilares.is-on .pl-lab{animation:pl-fade 500ms ease both}
.pilares.is-on .pl-lab-tec{animation-delay:800ms}.pilares.is-on .pl-lab-neg{animation-delay:1150ms}.pilares.is-on .pl-lab-per{animation-delay:1500ms}
.pilares.is-on .pilares-list li{animation:pl-rise 500ms ease both}
.pilares.is-on .pilares-list li:nth-child(1){animation-delay:800ms}.pilares.is-on .pilares-list li:nth-child(2){animation-delay:1150ms}.pilares.is-on .pilares-list li:nth-child(3){animation-delay:1500ms}
@keyframes pl-draw{from{stroke-dashoffset:1}to{stroke-dashoffset:0}}
@keyframes pl-fill{from{fill-opacity:0}to{fill-opacity:.1}}
@keyframes pl-fade{from{opacity:0}to{opacity:1}}
@keyframes pl-rise{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
@keyframes pl-pop{from{transform:scale(0);opacity:1}to{transform:scale(1);opacity:1}}
@keyframes pl-wave{0%{opacity:.8;transform:scale(1)}100%{opacity:0;transform:scale(3.4)}}
@media (prefers-reduced-motion:reduce){.pilares *{animation:none!important}.pl-packet,.pl-wave{display:none}.pilares-list li{translate:none!important}}

/* Ruta aleatoria entre los tres pilares (la controla main.js) */
.pl-node-a,.pl-node-b{transform-box:fill-box;transform-origin:center}
.js .pl-flow{opacity:0;transition:opacity .45s ease}
.js .pl-flow.is-show{opacity:1}
.js .pl-route-cut,.js .pl-a-cut,.js .pl-b-cut{opacity:0}
.pl-flow.is-arrived .pl-wave{animation:pl-wave 2.4s cubic-bezier(.2,.6,.35,1) infinite}
.pl-flow.is-arrived .pl-wave-2{animation-delay:1.2s}
.pl-flow.is-arrived .pl-packet{opacity:1}

/* Los tres pilares, a la derecha del encabezado de rutas, en su propio contenedor */
.rutas-head{display:grid;grid-template-columns:minmax(0,680px) minmax(0,1fr);gap:40px;align-items:center}
.pilares.pilares-mini{justify-self:center;width:100%;max-width:340px;aspect-ratio:1;padding:28px;display:flex;align-items:center;justify-content:center;border:1px solid var(--line);border-radius:8px;background:var(--surface-raised);box-sizing:border-box}
.pilares-mini .pilares-art{width:100%;height:100%;display:flex;align-items:center;justify-content:center}
.pilares-mini .pilares-svg{width:100%;height:100%;max-width:none}
@media (max-width:860px){.rutas-head{grid-template-columns:1fr}.pilares.pilares-mini{max-width:300px}}

/* Perfiles del fundador: los iconos son nodos de una ruta. Al entrar en pantalla la ruta se
   dibuja de izquierda a derecha y, en reposo, un paquete la recorre cada 6 s encendiendo
   cada nodo a su paso (manual de marca: «el movimiento es tráfico»). */
.fd-soc { position: relative; isolation: isolate; width: fit-content; max-width: 100%; }
.fd-soc::before { content: ""; position: absolute; z-index: -1; left: 24px; right: 24px; top: 32px; height: 2px; margin-top: -1px; border-radius: 2px; background: var(--route); box-shadow: 0 0 8px rgba(240, 80, 58, .45); opacity: .55; transform: scaleX(0); transform-origin: left; transition: transform var(--dur-route, 1.6s) var(--ease-route, ease); }
.fd-soc.is-on::before { transform: scaleX(1); }
.fd-soc::after { content: ""; position: absolute; z-index: 0; top: 32px; left: 24px; width: 6px; height: 6px; margin: -3px 0 0 -3px; border-radius: 50%; background: #FFE3DD; box-shadow: 0 0 10px var(--route), 0 0 3px var(--route); opacity: 0; pointer-events: none; }
.fd-soc.is-on::after { animation: fd-packet var(--dur-packet, 6s) linear 1.8s infinite; }
.fd-soc a { position: relative; z-index: 1; transition: border-color 120ms linear, color 120ms linear, box-shadow 200ms var(--ease-out, ease-out); }
.fd-soc.is-on a { animation: fd-node var(--dur-packet, 6s) linear infinite; }
.fd-soc.is-on a:nth-of-type(1) { animation-delay: 1.8s; }
.fd-soc.is-on a:nth-of-type(2) { animation-delay: 2.28s; }
.fd-soc.is-on a:nth-of-type(3) { animation-delay: 2.76s; }
.fd-soc.is-on a:nth-of-type(4) { animation-delay: 3.24s; }
.fd-soc.is-on a:nth-of-type(5) { animation-delay: 3.72s; }
.fd-soc a:hover, .fd-soc a:focus-visible { border-color: var(--route) !important; color: var(--route-text) !important; box-shadow: var(--glow-route); outline: none; animation-play-state: paused; }
@keyframes fd-packet { 0% { opacity: 0; transform: translateX(0); } 3% { opacity: 1; } 37% { opacity: 1; } 40% { opacity: 0; transform: translateX(calc(var(--fd-span, 240px))); } 100% { opacity: 0; transform: translateX(calc(var(--fd-span, 240px))); } }
@keyframes fd-node { 0%, 1% { border-color: var(--line-strong); color: var(--ink); box-shadow: none; } 4% { border-color: var(--route); color: var(--route-text); box-shadow: var(--glow-route); } 13%, 100% { border-color: var(--line-strong); color: var(--ink); box-shadow: none; } }
@media (prefers-reduced-motion: reduce) { .fd-soc::before { transform: scaleX(1); transition: none; } .fd-soc::after, .fd-soc.is-on::after { display: none; } .fd-soc.is-on a { animation: none; } }

/* Menú en celulares: acordeón detrás de un botón a la derecha, para que el logo se vea completo */
.hd-burger { display: none; }
@media (max-width: 720px) {
  header#inicio > div { flex-wrap: wrap !important; row-gap: 0 !important; }
  .hd-burger { display: inline-flex; flex-direction: column; align-items: center; justify-content: center; gap: 5px; margin-left: auto; width: 44px; height: 44px; padding: 0; border: 1px solid var(--line-strong); border-radius: 8px; background: var(--surface-raised); cursor: pointer; transition: border-color 120ms linear, box-shadow 200ms var(--ease-out, ease-out); }
  .hd-burger span { display: block; width: 18px; height: 2px; border-radius: 2px; background: var(--ink); transition: transform 200ms var(--ease-out, ease-out), opacity 120ms linear, background-color 120ms linear; }
  .hd-burger:hover, .hd-burger:focus-visible { border-color: var(--route); outline: none; box-shadow: var(--glow-route); }
  .hd-burger[aria-expanded="true"] { border-color: var(--route); }
  .hd-burger[aria-expanded="true"] span { background: var(--route-text); }
  .hd-burger[aria-expanded="true"] span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
  .hd-burger[aria-expanded="true"] span:nth-child(2) { opacity: 0; }
  .hd-burger[aria-expanded="true"] span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }
  .hd-menu { flex-basis: 100%; margin-left: 0 !important; align-items: stretch !important; max-height: 0; overflow: hidden; visibility: hidden; transition: max-height 320ms var(--ease-out, ease-out), visibility 0s linear 320ms; }
  .hd-menu.is-open { max-height: 320px; visibility: visible; transition: max-height 320ms var(--ease-out, ease-out), visibility 0s; }
  .hd-nav { flex-direction: column !important; align-items: stretch !important; gap: 0 !important; padding: 10px 0 2px; font-size: 16px !important; }
  .hd-nav a { position: relative; padding: 14px 4px 14px 16px; border-top: 1px solid var(--line); opacity: 0; transform: translateY(-6px); transition: opacity 200ms var(--ease-out, ease-out), transform 200ms var(--ease-out, ease-out), color 120ms linear; }
  .hd-nav a::before { content: ""; position: absolute; left: 0; top: 50%; width: 6px; height: 6px; margin-top: -3px; border-radius: 50%; background: var(--route); opacity: .55; }
  .hd-menu.is-open .hd-nav a { opacity: 1; transform: none; }
  .hd-menu.is-open .hd-nav a:nth-child(2) { transition-delay: 40ms; }
  .hd-menu.is-open .hd-nav a:nth-child(3) { transition-delay: 80ms; }
  .hd-menu.is-open .hd-nav a:nth-child(4) { transition-delay: 120ms; }
}
@media (max-width: 720px) and (prefers-reduced-motion: reduce) { .hd-menu, .hd-menu.is-open, .hd-nav a, .hd-burger span { transition: none; } }