/* Desktop composition: wider canvas, restrained reading widths. */
@media(min-width:1200px){
.wrap{max-width:1660px;padding-left:64px;padding-right:64px}
body:has(.immersive) header{max-width:1532px}
.immersive-stage{min-height:700px}
.immersive-copy{padding-top:45px;max-width:650px}
.immersive-copy h1{font-size:clamp(112px,7.6vw,138px);line-height:.98;margin:20px 0 24px}
.immersive-copy h2{font-size:32px;margin:18px 0 16px}
.immersive-copy p{max-width:490px;line-height:1.65}
.immersive-copy .actions{margin-top:24px}
.immersive .scroll-cue{margin-top:28px;padding-bottom:20px}
.immersive-portrait{right:0;width:57%;height:700px;bottom:0}
.immersive-portrait img{object-position:50% 25%}
.immersive .portrait-dedication{right:15%;bottom:32px}
.immersive-credentials{padding:20px 0}
#sobre-andres.about-note{gap:clamp(65px,6vw,110px)}
#sobre-andres .about-note-letter{max-width:640px}
}
@media(min-width:1600px){.immersive-stage{min-height:720px}.immersive-portrait{height:740px}.immersive-copy{padding-top:48px}}

/* Continuous light field: the photograph dissolves into the entire hero. */
.immersive{background-color:#0a0b14;background-image:radial-gradient(ellipse at 82% 46%,rgba(155,0,175,.16),transparent 49%),radial-gradient(ellipse at 59% 48%,rgba(0,90,245,.14),transparent 43%)}
.immersive-portrait{mask-image:none;-webkit-mask-image:none;overflow:visible}
.immersive-portrait img{mask-image:linear-gradient(90deg,transparent 0%,#000 24%,#000 72%,transparent 100%),linear-gradient(0deg,transparent 0%,#000 18%,#000 78%,transparent 100%);mask-composite:intersect;-webkit-mask-image:linear-gradient(90deg,transparent 0%,#000 24%,#000 72%,transparent 100%),linear-gradient(0deg,transparent 0%,#000 18%,#000 78%,transparent 100%);-webkit-mask-composite:source-in}
.immersive-portrait:after{display:none}
.immersive .portrait-dedication{z-index:1}
/* Full-width footer surface, aligned content without a boxed background. */
.wrap.footer-shell{max-width:none;width:100%;margin:0;padding-left:max(64px,calc((100% - 1532px)/2));padding-right:max(64px,calc((100% - 1532px)/2));border-radius:0;background:linear-gradient(110deg,#f0faff 0%,#fff 47%,#f7f3ff 100%)}
.footer-shell .site-footer{max-width:none;width:100%;margin:0}
@media(max-width:1199px){.wrap.footer-shell{padding-left:64px;padding-right:64px}}
@media(max-width:1050px){.wrap.footer-shell{padding-left:30px;padding-right:30px}}
@media(max-width:700px){.wrap.footer-shell{padding-left:22px;padding-right:22px}.immersive{background-image:radial-gradient(ellipse at 85% 72%,rgba(155,0,175,.15),transparent 40%),radial-gradient(ellipse at 18% 76%,rgba(0,90,245,.12),transparent 36%)}.immersive-portrait img{mask-image:linear-gradient(90deg,transparent,#000 12%,#000 88%,transparent),linear-gradient(0deg,transparent,#000 12%,#000 85%,transparent);-webkit-mask-image:linear-gradient(90deg,transparent,#000 12%,#000 88%,transparent),linear-gradient(0deg,transparent,#000 12%,#000 85%,transparent)}}

/* Art direction refinement: one continuous scene, no rectangular light patch. */
.immersive{background-image:radial-gradient(ellipse 62% 85% at 98% 58%,#42104466 0%,#27103238 45%,transparent 78%),radial-gradient(ellipse 58% 80% at 55% 62%,#072e7266 0%,#09254b33 42%,transparent 78%)}
.immersive-portrait img{mask-image:radial-gradient(ellipse 57% 65% at 53% 48%,#000 42%,rgba(0,0,0,.93) 57%,rgba(0,0,0,.45) 76%,transparent 97%);-webkit-mask-image:radial-gradient(ellipse 57% 65% at 53% 48%,#000 42%,rgba(0,0,0,.93) 57%,rgba(0,0,0,.45) 76%,transparent 97%);mask-composite:add;-webkit-mask-composite:source-over}
.wrap.footer-shell{background:#f4f6fb;isolation:isolate;border:0;box-shadow:none}
.footer-shell:before{height:1px;background:#dedfe9}
.footer-shell .site-footer{background:transparent;border:0;box-shadow:none;border-radius:0}
@media(min-width:1200px){.immersive-portrait{width:61%;right:-2%;height:740px}.immersive .portrait-dedication{right:19%;bottom:55px}}
@media(min-width:1600px){.immersive-portrait{width:58%;height:770px;right:0}}
@media(max-width:700px){.immersive{background-image:radial-gradient(ellipse at 90% 80%,#42104466,transparent 60%),radial-gradient(ellipse at 12% 76%,#072e7255,transparent 52%)}.immersive-portrait img{mask-image:radial-gradient(ellipse 66% 66% at 50% 45%,#000 45%,#000b 70%,transparent 99%);-webkit-mask-image:radial-gradient(ellipse 66% 66% at 50% 45%,#000 45%,#000b 70%,transparent 99%)}}
.immersive-portrait img{-webkit-mask-image:linear-gradient(90deg,transparent 0%,#000 28%,#000 67%,transparent 100%),linear-gradient(0deg,transparent 0%,#000 24%,#000 76%,transparent 100%);-webkit-mask-composite:source-in;mask-image:linear-gradient(90deg,transparent 0%,#000 28%,#000 67%,transparent 100%),linear-gradient(0deg,transparent 0%,#000 24%,#000 76%,transparent 100%);mask-composite:intersect}

/* Shared experience CTA and original vector agency identity. */
.experience-editorial .story-link:focus-visible{outline:2px solid #642acf;outline-offset:7px;border-radius:5px}
.advency-banner .advency-original-lockup{width:min(100%,230px);height:44px;overflow:visible;background:none;mix-blend-mode:normal;display:flex;align-items:center}
.advency-banner .advency-original-lockup img{position:static!important;left:auto;top:auto;width:100%!important;height:auto!important;max-width:100%!important;object-fit:contain;mix-blend-mode:normal}
@media(max-width:760px){.experience-editorial .story-read{width:100%;min-height:50px}.experience-editorial .story-copy{max-width:none}}
@media(prefers-reduced-motion:reduce){.experience-editorial .story-read{transition:none}}

/* A single quiet image affordance, shared by all four stories. */
.experience-editorial .story-open{width:68px;height:46px;right:18px;bottom:18px;border-radius:12px;border:1px solid #ffffff66;background:rgba(19,14,37,.68);color:#fff;backdrop-filter:blur(12px);font-size:25px;box-shadow:0 4px 16px #08061118;transition:background .22s,border-color .22s,transform .22s}
.experience-editorial .story-link:hover .story-open,.experience-editorial .story-link:focus-visible .story-open{background:#642acf;border-color:#a784ed;color:#fff;transform:translateY(-2px)}
.experience-editorial .story-link:active .story-open{transform:translateY(0);background:#492095}
@media(max-width:760px){.experience-editorial .story-open{width:62px;height:46px;right:14px;bottom:14px}}
@media(prefers-reduced-motion:reduce){.experience-editorial .story-open{transition:none;transform:none!important}}
/* Magenta image controls echo the AQ identity. */
.experience-editorial .story-open{background:#b913c9;border-color:#e97af066;color:#fff;box-shadow:0 4px 16px #690e6c22}
.experience-editorial .story-link:hover .story-open,.experience-editorial .story-link:focus-visible .story-open{background:#d51ae5;border-color:#f4a4fa;color:#fff}
.experience-editorial .story-link:active .story-open{background:#9611a4}
/* Restrained glass control with a fine AQ spectrum edge. */
.experience-editorial .story-open{width:62px;height:48px;border:1px solid transparent;border-radius:14px;background:linear-gradient(#141322e8,#141322e8) padding-box,linear-gradient(135deg,#75dded99,#a98aea55 48%,#e768d199) border-box;box-shadow:0 4px 14px #05041330,inset 0 1px 0 #ffffff0d;color:#f8f5ff;backdrop-filter:blur(14px);font-size:0}
.experience-editorial .story-open:before{content:'';width:19px;height:19px;background:currentColor;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M6 18 18 6M6 6h12v12' fill='none' stroke='black' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/contain no-repeat}
.experience-editorial .story-link:hover .story-open,.experience-editorial .story-link:focus-visible .story-open{background:linear-gradient(#292139ed,#292139ed) padding-box,linear-gradient(135deg,#86e8f6,#b699ec 48%,#ef8ade) border-box;border-color:transparent;box-shadow:0 6px 20px #170e352e;color:#fff}
.experience-editorial .story-link:active .story-open{background:linear-gradient(#191526,#191526) padding-box,linear-gradient(135deg,#86e8f6,#ef8ade) border-box}
/* Explicit image calls to action, with a quiet directional icon. */
.experience-editorial .story-open{display:flex;align-items:center;justify-content:space-between;gap:22px;width:auto;height:48px;padding:0 16px;border-radius:10px;font-family:Manrope,Arial,sans-serif;font-size:13px;font-weight:600;letter-spacing:0;line-height:1;white-space:nowrap}
.experience-editorial .story-open:before{content:none}
.experience-editorial .story-open svg{display:block;width:20px;height:20px;flex-shrink:0;transition:transform .22s}
.experience-editorial .story-link:hover .story-open svg,.experience-editorial .story-link:focus-visible .story-open svg{transform:translateX(3px)}
@media(max-width:760px){.experience-editorial .story-open{height:46px;padding:0 14px;gap:18px;font-size:12px}}
@media(prefers-reduced-motion:reduce){.experience-editorial .story-open svg{transition:none;transform:none!important}}
/* A travelling light confined to the CTA perimeter. */
@property --aq-edge-angle{syntax:'<angle>';initial-value:0deg;inherits:false}
.experience-editorial .story-open{isolation:isolate;overflow:visible}
.experience-editorial .story-open:before{content:'';position:absolute;inset:-1px;width:auto;height:auto;border-radius:inherit;padding:1.5px;pointer-events:none;background:conic-gradient(from var(--aq-edge-angle),transparent 0deg,transparent 210deg,#51ddeb66 250deg,#8aefff 278deg,#e790ed 306deg,transparent 344deg);-webkit-mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);-webkit-mask-composite:xor;mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);mask-composite:exclude;opacity:.72;animation:aq-edge-travel 5s linear infinite;transition:opacity .25s}
.experience-editorial .expertise-story:nth-child(2) .story-open:before{animation-delay:-1.25s}
.experience-editorial .expertise-story:nth-child(3) .story-open:before{animation-delay:-2.5s}
.experience-editorial .expertise-story:nth-child(4) .story-open:before{animation-delay:-3.75s}
.experience-editorial .story-link:hover .story-open:before,.experience-editorial .story-link:focus-visible .story-open:before{opacity:1}
@keyframes aq-edge-travel{to{--aq-edge-angle:360deg}}
@media(prefers-reduced-motion:reduce){.experience-editorial .story-open:before{animation:none;--aq-edge-angle:45deg;transition:none}}
/* Personal signature and secondary platform attribution. */
.path-community .path-identity{display:flex;align-items:baseline;gap:7px;white-space:nowrap}
.path-community .path-identity>span{display:inline-flex;align-items:baseline;gap:7px}
.path-community .community-signature{display:inline-block;font-family:Caveat,cursive;font-weight:400;font-style:normal;font-size:35px;line-height:1;letter-spacing:-.5px;transform:rotate(-5deg);color:#d8f6fa}
.path-community .community-platform{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:20px;padding-top:16px;border-top:1px solid #ffffff1a}
.path-community .community-platform>span{font-size:11px;letter-spacing:.2px;color:#a9c4cd}
.path-community .community-platform img{display:block;width:72px;height:auto;max-height:26px}
@media(max-width:420px){.path-community .path-identity{font-size:22px;gap:6px}.path-community .community-signature{font-size:33px}}.path-community .community-platform img{box-sizing:content-box;background:#f8f7f2;border-radius:5px;padding:5px 8px;width:64px}

/* Shared handwritten name across both personal learning paths. */
.path .personal-identity{display:flex;align-items:baseline;gap:12px}
.path .personal-identity .personal-name-signature{display:inline-block;font-family:Caveat,cursive;font-weight:400;font-style:normal;font-size:35px;line-height:1;letter-spacing:-.5px;transform:rotate(-5deg);color:#d8f6fa}
.path .personal-identity>span{font-family:Manrope,Arial,sans-serif;font-size:18px;font-weight:600;line-height:1;color:#d8e5fa}
@media(max-width:420px){.path .personal-identity .personal-name-signature{font-size:33px}}
/* Shared CTA baseline; platform attribution has its own reserved footer. */
main>.dark-section .path{position:relative;padding-bottom:92px}
main>.dark-section .path>.button{display:flex;align-items:center;justify-content:center;width:100%;min-height:48px;margin-top:auto;padding:13px 18px;font-family:Manrope,Arial,sans-serif;font-size:14px;font-weight:600;letter-spacing:0;line-height:1.4;border-radius:10px;text-align:center}
main>.dark-section .path-community .community-platform{position:absolute;left:28px;right:28px;bottom:22px;margin:0;padding-top:12px;height:44px;box-sizing:border-box}
@media(max-width:700px){main>.dark-section .path{padding-bottom:26px}main>.dark-section .path-community{padding-bottom:92px}main>.dark-section .path-community .community-platform{left:26px;right:26px}}/* Keep pale CTA labels legible in every interaction state. */
main>.dark-section .path-community>.button:is(:hover,:focus-visible,:active){color:#102d37}
main>.dark-section .path-personal>.button:is(:hover,:focus-visible,:active){color:#17243e}
/* Stack the three choices before their labels and copy become cramped. */
@media(min-width:701px) and (max-width:1000px){
 main>.dark-section .cards{grid-template-columns:minmax(0,1fr)}
 main>.dark-section .path{padding-bottom:28px}
 main>.dark-section .path-community{padding-bottom:92px}
 main>.dark-section .path h3{min-height:0}
}
/* Lighter editorial headings for the three ways to work together. */
main>.dark-section .path h3{font-family:Manrope,Arial,sans-serif;font-weight:500;letter-spacing:-.55px;line-height:1.35}
main>.dark-section .path .path-identity{font-weight:500}
main>.dark-section .path .path-identity>span{font-weight:500}
.story-link:is(:hover,:focus-visible) .story-open svg{transform:translate(2px,-2px)}@media(prefers-reduced-motion:reduce){.story-link:is(:hover,:focus-visible) .story-open svg{transform:none}}
.experience-editorial .story-arrow{font:inherit;line-height:1;flex-shrink:0}
/* Persistent brand navigation, shared by home and inner pages. */
body>.wrap:has(>header){position:sticky;top:0;z-index:100;max-width:none;width:100%;box-sizing:border-box;background:rgba(10,11,20,.96)!important;color:#f8f7fc;backdrop-filter:blur(16px);border-bottom:1px solid #ffffff14;box-shadow:0 6px 24px #090a1410}
body>.wrap>header{height:82px;max-width:1532px;margin:auto;border-bottom:0;gap:24px}
body>.wrap>header .navcta{display:inline-flex;align-items:center;justify-content:center;min-height:44px;padding:10px 18px;border:1px solid #a481ff55;border-radius:9px;background:#713de5;color:#fff;font-weight:600;line-height:1.2;transition:background .2s,box-shadow .2s}
body>.wrap>header .navcta:hover{background:#8251ed;box-shadow:0 4px 18px #713de530}
body>.wrap>header nav{background:transparent}
body>.wrap>header nav a{color:#e3e1eb;font-size:14px}
body>.wrap>header nav a:hover{color:#c5b2ff}
body>.wrap>header .menu{color:#fff;border-color:#ffffff35;border-radius:8px;min-height:44px}
html{scroll-padding-top:104px}
@media(max-width:900px){body>.wrap>header{height:72px}body>.wrap>header .navcta{display:none}body>.wrap>header nav.open{background:#11121f;border:1px solid #ffffff20;border-radius:12px;box-shadow:0 16px 40px #0003}html{scroll-padding-top:90px}}

@media(max-width:700px){body>.wrap:has(>header){backdrop-filter:none;background:#0a0b14!important}.experience-editorial .story-open{backdrop-filter:none}.experience-editorial .story-open:before{animation:none;--aq-edge-angle:45deg}}

@media(max-width:700px){body>.wrap:has(>header){backdrop-filter:none;background:#0a0b14!important}.experience-editorial .story-open{backdrop-filter:none}.experience-editorial .story-open:before{animation:none;--aq-edge-angle:45deg}}