/* =================================================================
   AETHEL CO. — Landing Page
   Premium · Aristocrático · Tecnológico
   ================================================================= */

:root{
  --void:#060606;
  --void-2:#0a0c0e;
  --ink:#101418;
  --bone:#eef2f3;
  --bone-dim:#c4ccd0;
  --mute:#7c8890;
  --mute-2:#525c63;
  --line:rgba(255,255,255,.09);
  --line-soft:rgba(255,255,255,.045);

  --cyan:#27b9e0;
  --azure:#0aa0cc;
  --blue:#0079ab;
  --deep:#084266;
  --grad: linear-gradient(135deg,#2fc0e6 0%, #0a9fcc 42%, #0079ab 100%);
  --grad-soft: linear-gradient(135deg,#27b9e0 0%, #0a7fae 100%);

  --ff-display:"Cormorant Garamond", Georgia, serif;
  --ff-mono:"JetBrains Mono", ui-monospace, monospace;

  --ease:cubic-bezier(.16,1,.3,1);
  --ease-2:cubic-bezier(.7,0,.2,1);

  --pad: clamp(20px, 5vw, 90px);
  --maxw: 1320px;
}

*{margin:0;padding:0;box-sizing:border-box;}
html{scroll-behavior:smooth;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;}
html.is-loading{overflow:hidden;}

body{
  background:var(--void);
  color:var(--bone);
  font-family:var(--ff-display);
  font-size:18px;
  line-height:1.55;
  overflow-x:hidden;
  position:relative;
}

::selection{background:var(--azure);color:#02141c;}

a{color:inherit;text-decoration:none;}
.mono{font-family:var(--ff-mono);font-weight:400;letter-spacing:.18em;text-transform:uppercase;}
.italic{font-style:italic;}
.accent{color:var(--cyan);}
.accent-soft{color:var(--cyan);}

/* gradient text */
.h-display .grad, .grad-text{
  background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent;
}

/* =================== OVERLAYS =================== */
.grain{
  position:fixed;inset:0;z-index:9000;pointer-events:none;opacity:.05;mix-blend-mode:overlay;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='3'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}
.vignette{
  position:fixed;inset:0;z-index:8500;pointer-events:none;
  background:radial-gradient(140% 120% at 50% 38%, transparent 64%, rgba(0,0,0,.42) 100%);
}

/* =================== CURSOR =================== */
.cursor,.cursor-dot{position:fixed;top:0;left:0;z-index:9999;pointer-events:none;border-radius:50%;mix-blend-mode:difference;}
.cursor{width:38px;height:38px;border:1px solid rgba(255,255,255,.6);transform:translate(-50%,-50%);transition:width .35s var(--ease),height .35s var(--ease),background .35s,border-color .35s;}
.cursor-dot{width:5px;height:5px;background:#fff;transform:translate(-50%,-50%);}
.cursor.is-hover{width:64px;height:64px;background:rgba(255,255,255,.08);border-color:transparent;}
@media(hover:none),(pointer:coarse){.cursor,.cursor-dot{display:none;}}

/* =================== PRELOADER =================== */
.preloader{position:fixed;inset:0;z-index:9500;background:var(--void);display:flex;align-items:center;justify-content:center;transition:transform 1s var(--ease-2);}
.preloader.done{transform:translateY(-101%);}
.preloader__inner{width:min(420px,80vw);text-align:center;}
.preloader__mark{width:64px;height:64px;object-fit:contain;filter:drop-shadow(0 0 30px rgba(39,185,224,.35));animation:floaty 3s ease-in-out infinite;}
.preloader__bar{margin:34px 0 14px;height:1px;background:var(--line);position:relative;overflow:hidden;}
.preloader__bar span{position:absolute;inset:0;width:0;background:var(--grad);box-shadow:0 0 14px var(--azure);}
.preloader__meta{display:flex;justify-content:space-between;font-size:11px;color:var(--mute);}
@keyframes floaty{50%{transform:translateY(-8px);}}

/* =================== SCROLL RAIL =================== */
.scroll-rail{position:fixed;top:0;left:0;width:100%;height:2px;z-index:8000;background:transparent;}
.scroll-rail span{display:block;height:100%;width:0;background:var(--grad);box-shadow:0 0 12px rgba(39,185,224,.6);}

/* =================== NAV =================== */
.nav{
  position:fixed;top:0;left:0;width:100%;z-index:7000;
  display:flex;align-items:center;justify-content:space-between;gap:24px;
  padding:22px var(--pad);
  transition:padding .5s var(--ease),background .5s,backdrop-filter .5s,border-color .5s;
  border-bottom:1px solid transparent;
}
.nav.shrink{padding:14px var(--pad);background:rgba(6,6,6,.6);backdrop-filter:blur(14px) saturate(1.2);border-bottom-color:var(--line-soft);}
.nav__brand{display:flex;align-items:center;gap:12px;}
.nav__mark{width:30px;height:30px;object-fit:contain;}
.nav__word{font-size:23px;font-weight:600;letter-spacing:.01em;}
.nav__co{color:var(--cyan);font-style:italic;font-weight:500;}
.nav__links{display:flex;gap:30px;}
.nav__link{font-size:11px;color:var(--bone-dim);position:relative;padding:4px 0;transition:color .3s;}
.nav__link::after{content:"";position:absolute;left:0;bottom:0;width:0;height:1px;background:var(--cyan);transition:width .4s var(--ease);}
.nav__link:hover{color:var(--bone);}
.nav__link:hover::after{width:100%;}
.nav__cta{
  display:inline-flex;align-items:center;gap:10px;font-size:11px;color:var(--bone);
  padding:11px 20px;border:1px solid var(--line);border-radius:40px;
  position:relative;overflow:hidden;transition:color .4s,border-color .4s;
}
.nav__cta svg{transition:transform .4s var(--ease);}
.nav__cta::before{content:"";position:absolute;inset:0;background:var(--grad);transform:translateY(101%);transition:transform .5s var(--ease);z-index:-1;}
.nav__cta:hover{color:#021018;border-color:transparent;}
.nav__cta:hover::before{transform:translateY(0);}
.nav__cta:hover svg{transform:translateX(4px);}

@media(max-width:860px){.nav__links{display:none;}}
@media(max-width:560px){
  .nav{padding:16px 20px;}
  .nav.shrink{padding:12px 20px;}
  .nav__word{font-size:19px;}
  .nav__mark{width:26px;height:26px;}
  .nav__cta{padding:10px 16px;font-size:10px;letter-spacing:.1em;gap:7px;}
  .nav__cta span{white-space:nowrap;}
}

/* =================== SECTION SHARED =================== */
.section-index{display:block;font-size:11px;color:var(--mute);margin-bottom:26px;}
.section-index.center{text-align:center;}
.h-display{font-size:clamp(34px,5.5vw,76px);font-weight:500;line-height:1.02;letter-spacing:-.01em;}

/* =================== HERO =================== */
.hero{position:relative;min-height:100svh;display:flex;flex-direction:column;justify-content:center;padding:120px var(--pad) 90px;overflow:hidden;}
.hero__canvas{position:absolute;inset:0;width:100%;height:100%;z-index:0;opacity:.7;}
.hero__glow{position:absolute;z-index:0;width:75vw;height:75vw;max-width:900px;max-height:900px;right:-12vw;top:-18vw;border-radius:50%;
  background:radial-gradient(circle, rgba(10,160,204,.20) 0%, rgba(8,66,102,.08) 38%, transparent 66%);filter:blur(20px);}
.hero__ghostmark{position:absolute;z-index:0;right:clamp(-180px,-8vw,-70px);top:50%;transform:translateY(-50%);
  width:min(58vw,680px);opacity:.045;pointer-events:none;will-change:transform;
  -webkit-mask-image:radial-gradient(closest-side at 50% 50%, #000 22%, transparent 76%);
  mask-image:radial-gradient(closest-side at 50% 50%, #000 22%, transparent 76%);}

.hero__inner{position:relative;z-index:2;max-width:var(--maxw);width:100%;margin:0 auto;}
.hero__eyebrow{display:inline-flex;align-items:center;gap:12px;font-size:11px;color:var(--bone-dim);margin-bottom:34px;}
.hero__eyebrow .dot{width:7px;height:7px;border-radius:50%;background:var(--cyan);box-shadow:0 0 12px var(--cyan);animation:pulse 2s ease-in-out infinite;}
@keyframes pulse{50%{opacity:.35;transform:scale(.8);}}

.hero__title{font-size:clamp(46px,9.2vw,140px);font-weight:500;line-height:.96;letter-spacing:-.025em;margin-bottom:36px;}
.hero__title .line{display:block;overflow:hidden;}
.hero__title .w{display:inline-block;transform:translateY(110%);}
.hero__title .italic{font-style:italic;font-weight:400;}
.hero__title .w.italic{background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent;padding-right:.06em;}

.hero__sub{max-width:540px;font-size:clamp(18px,2.1vw,23px);color:var(--bone-dim);font-weight:400;line-height:1.5;margin-bottom:44px;}
.hero__actions{display:flex;gap:16px;flex-wrap:wrap;}

.hero__scrollcue{position:absolute;left:var(--pad);bottom:38px;z-index:2;display:flex;align-items:center;gap:14px;font-size:10px;color:var(--mute);}
.hero__scrollline{width:60px;height:1px;background:var(--line);position:relative;overflow:hidden;}
.hero__scrollline::after{content:"";position:absolute;inset:0;background:var(--cyan);animation:scrollline 2.4s var(--ease) infinite;}
@keyframes scrollline{0%{transform:translateX(-100%);}60%,100%{transform:translateX(100%);}}

.hero__ticker{position:absolute;right:0;bottom:34px;z-index:2;width:min(46vw,560px);overflow:hidden;-webkit-mask-image:linear-gradient(90deg,transparent,#000 18%,#000 82%,transparent);mask-image:linear-gradient(90deg,transparent,#000 18%,#000 82%,transparent);}
.ticker__track{display:flex;align-items:center;gap:26px;white-space:nowrap;width:max-content;animation:ticker 26s linear infinite;font-family:var(--ff-mono);font-size:11px;letter-spacing:.22em;color:var(--mute-2);}
.ticker__track i{color:var(--azure);font-style:normal;}
@keyframes ticker{to{transform:translateX(-50%);}}
@media(max-width:860px){.hero__ticker{display:none;}.hero__scrollcue{display:none;}}

/* =================== BUTTONS =================== */
.btn{display:inline-flex;align-items:center;gap:12px;font-family:var(--ff-mono);font-size:12px;letter-spacing:.14em;text-transform:uppercase;
  padding:16px 28px;border-radius:46px;position:relative;overflow:hidden;transition:color .45s var(--ease),transform .3s var(--ease),border-color .45s;will-change:transform;}
.btn--lg{padding:20px 38px;font-size:13px;}
.btn svg{position:relative;z-index:2;transition:transform .4s var(--ease);}
.btn--primary{color:#02161e;background:var(--grad);box-shadow:0 10px 40px -12px rgba(10,160,204,.7);}
.btn--primary::before{content:"";position:absolute;inset:0;background:linear-gradient(135deg,#5fd2f0,#0a9fcc);opacity:0;transition:opacity .45s;z-index:0;}
.btn--primary span{position:relative;z-index:2;}
.btn--primary:hover::before{opacity:1;}
.btn--primary:hover{transform:translateY(-3px);box-shadow:0 18px 50px -12px rgba(10,160,204,.85);}
.btn--primary:hover svg{transform:scale(1.08);}
.btn--ghost{color:var(--bone);border:1px solid var(--line);}
.btn--ghost::before{content:"";position:absolute;inset:0;background:rgba(255,255,255,.05);transform:translateY(101%);transition:transform .5s var(--ease);}
.btn--ghost span{position:relative;z-index:2;}
.btn--ghost:hover{border-color:rgba(255,255,255,.3);transform:translateY(-3px);}
.btn--ghost:hover::before{transform:translateY(0);}

/* =================== MANIFESTO =================== */
.manifesto{max-width:var(--maxw);margin:0 auto;padding:clamp(110px,16vh,200px) var(--pad);position:relative;overflow:hidden;}
.manifesto > .section-index,.manifesto__text,.manifesto__rule,.manifesto__counter{position:relative;z-index:2;}
.manifesto__object{
  position:absolute;z-index:0;right:clamp(-60px,-3vw,-10px);top:50%;transform:translateY(-50%);
  width:clamp(300px,42vw,580px);aspect-ratio:840/820;object-fit:contain;
  opacity:.92;pointer-events:none;will-change:transform;
  -webkit-mask-image:radial-gradient(62% 60% at 52% 45%, #000 46%, transparent 78%);
  mask-image:radial-gradient(62% 60% at 52% 45%, #000 46%, transparent 78%);
  filter:drop-shadow(0 30px 70px rgba(0,0,0,.55));
}
.manifesto__text{font-size:clamp(28px,4.6vw,62px);font-weight:400;line-height:1.18;letter-spacing:-.012em;max-width:16ch;}
.manifesto__text .accent{font-style:italic;}
.manifesto__rule{height:1px;background:var(--line);margin:clamp(40px,7vh,80px) 0;position:relative;overflow:hidden;}
.manifesto__rule::after{content:"";position:absolute;left:0;top:0;height:100%;width:0;background:var(--grad);transition:width 1.4s var(--ease);}
.manifesto__rule.in::after{width:100%;}
.manifesto__counter{font-size:clamp(20px,2.5vw,30px);color:var(--bone-dim);font-weight:400;max-width:30ch;margin-left:auto;line-height:1.4;}

/* word reveal */
[data-reveal-words] .word{display:inline-block;opacity:.12;transition:opacity .5s var(--ease);}
[data-reveal-words] .word.lit{opacity:1;}
[data-reveal-words] .accent.word, [data-reveal-words] .word .accent{transition:opacity .5s var(--ease);}

/* =================== METHOD =================== */
.method{max-width:var(--maxw);margin:0 auto;padding:clamp(60px,8vh,90px) var(--pad) clamp(110px,16vh,180px);}
.method__head{margin-bottom:clamp(50px,7vh,84px);}
.method__grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--line-soft);border:1px solid var(--line-soft);}
.card{position:relative;background:var(--void);padding:clamp(34px,3.4vw,52px) clamp(28px,2.6vw,40px) clamp(40px,4vw,60px);overflow:hidden;transition:background .5s;min-height:340px;display:flex;flex-direction:column;}
.card__spot{position:absolute;width:340px;height:340px;border-radius:50%;background:radial-gradient(circle,rgba(10,160,204,.16),transparent 60%);opacity:0;transform:translate(-50%,-50%);transition:opacity .4s;pointer-events:none;left:var(--mx,50%);top:var(--my,50%);}
.card:hover .card__spot{opacity:1;}
.card__num{font-size:12px;color:var(--azure);margin-bottom:auto;}
.card__title{font-size:clamp(28px,2.8vw,40px);font-weight:500;line-height:1.05;margin:50px 0 18px;letter-spacing:-.01em;}
.card__body{font-size:16px;color:var(--mute);line-height:1.55;font-family:var(--ff-mono);font-weight:300;letter-spacing:.01em;text-transform:none;}
.card__line{position:absolute;left:0;bottom:0;width:100%;height:2px;background:var(--grad);transform:scaleX(0);transform-origin:left;transition:transform .6s var(--ease);}
.card:hover .card__line{transform:scaleX(1);}
@media(max-width:860px){.method__grid{grid-template-columns:1fr;}.card{min-height:auto;}}

/* =================== FOR WHOM =================== */
.forwhom{position:relative;padding:clamp(120px,20vh,240px) var(--pad);text-align:center;overflow:hidden;}
.forwhom__bg{position:absolute;inset:0;background:radial-gradient(70% 120% at 50% 50%, rgba(8,66,102,.22), transparent 70%);}
.forwhom .section-index{position:relative;}
.forwhom__text{position:relative;font-size:clamp(28px,4.4vw,58px);font-weight:400;line-height:1.22;letter-spacing:-.012em;max-width:20ch;margin:0 auto;}
.forwhom__text .accent{font-style:italic;}

/* =================== SOCIO =================== */
.socio{max-width:var(--maxw);margin:0 auto;padding:clamp(80px,12vh,140px) var(--pad);display:grid;grid-template-columns:.9fr 1.1fr;gap:clamp(40px,5vw,90px);align-items:center;}
.socio__media{position:relative;display:flex;justify-content:center;align-items:flex-end;min-height:520px;}
.socio__halo{position:absolute;width:115%;height:90%;left:50%;top:54%;transform:translate(-50%,-50%);
  background:radial-gradient(circle at 50% 45%, rgba(10,160,204,.28),rgba(8,66,102,.10) 45%, transparent 68%);filter:blur(10px);z-index:0;}
.socio__halo::after{content:"";position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:78%;aspect-ratio:1;border-radius:50%;border:1px solid rgba(39,185,224,.18);animation:spin 26s linear infinite;}
@keyframes spin{to{transform:translate(-50%,-50%) rotate(360deg);}}
.socio__photo{position:relative;z-index:2;width:100%;max-width:460px;object-fit:contain;filter:drop-shadow(0 40px 60px rgba(0,0,0,.7)) drop-shadow(0 0 1px rgba(255,255,255,.1));
  -webkit-mask-image:linear-gradient(180deg,#000 84%,transparent 100%);mask-image:linear-gradient(180deg,#000 84%,transparent 100%);}
.socio__plate{position:absolute;left:0;bottom:24px;z-index:3;display:flex;flex-direction:column;gap:6px;font-size:9.5px;color:var(--mute);border-left:1px solid var(--azure);padding-left:12px;}

.socio__content{position:relative;}
.socio__name{margin:10px 0 8px;}
.socio__role{display:inline-block;font-size:11px;color:var(--cyan);margin-bottom:30px;}
.socio__quote{font-size:clamp(21px,2.4vw,30px);font-weight:400;line-height:1.45;color:var(--bone-dim);font-style:italic;max-width:30ch;margin-bottom:38px;}
.socio__ig{display:inline-flex;align-items:center;gap:11px;font-size:12px;color:var(--bone);padding:14px 24px;border:1px solid var(--line);border-radius:40px;transition:border-color .4s,color .4s,background .4s;}
.socio__ig:hover{border-color:var(--azure);color:var(--cyan);background:rgba(10,160,204,.06);}
@media(max-width:860px){.socio{grid-template-columns:1fr;}.socio__media{min-height:auto;margin-bottom:30px;}.socio__photo{max-width:340px;}}

@media(max-width:860px){
  .manifesto__object{width:min(74vw,340px);right:-44px;top:auto;bottom:3%;transform:none;opacity:.45;}
}

/* =================== CTA =================== */
.cta{position:relative;padding:clamp(120px,18vh,220px) var(--pad);text-align:center;overflow:hidden;border-top:1px solid var(--line-soft);}
.cta__canvas{position:absolute;inset:0;width:100%;height:100%;z-index:0;opacity:.55;}
.cta__inner{position:relative;z-index:2;max-width:1000px;margin:0 auto;}
.cta__title{font-size:clamp(40px,7vw,104px);font-weight:500;line-height:1.0;letter-spacing:-.022em;margin:18px 0 30px;}
.cta__title .italic{font-style:italic;font-weight:400;background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent;}
.cta__sub{max-width:560px;margin:0 auto 48px;color:var(--bone-dim);font-size:clamp(18px,2vw,22px);}
.cta__actions{display:flex;gap:18px;justify-content:center;flex-wrap:wrap;}

/* =================== FOOTER =================== */
.footer{padding:clamp(60px,8vh,90px) var(--pad) 44px;border-top:1px solid var(--line-soft);background:var(--void-2);}
.footer__top{display:flex;align-items:center;justify-content:space-between;gap:30px;flex-wrap:wrap;padding-bottom:clamp(40px,6vh,70px);border-bottom:1px solid var(--line-soft);}
.footer__logo{height:30px;width:auto;opacity:.92;}
.footer__tag{font-size:10px;color:var(--mute);}
.footer__grid{display:grid;grid-template-columns:repeat(3,1fr);gap:30px;padding-top:44px;}
.footer__col{display:flex;flex-direction:column;gap:12px;}
.footer__col--right{text-align:right;align-items:flex-end;}
.footer__label{font-size:10px;color:var(--mute-2);margin-bottom:6px;}
.footer__col a{font-size:17px;color:var(--bone-dim);transition:color .3s;width:fit-content;}
.footer__col a:hover{color:var(--cyan);}
.footer__fine{font-size:13px;color:var(--mute);font-family:var(--ff-mono);text-transform:uppercase;letter-spacing:.1em;line-height:1.8;}
@media(max-width:680px){.footer__grid{grid-template-columns:1fr;}.footer__col--right{text-align:left;align-items:flex-start;}}

/* =================== REVEAL STATES =================== */
.reveal-fade{opacity:0;transform:translateY(26px);transition:opacity 1s var(--ease),transform 1s var(--ease);}
.reveal-fade.in{opacity:1;transform:none;}
.reveal-line{opacity:0;transform:translateY(18px);transition:opacity .9s var(--ease),transform .9s var(--ease);}
.reveal-line.in{opacity:1;transform:none;}

/* hero entrance (after preload) */
.is-ready .hero__title .w{transition:transform 1.1s var(--ease);}
.is-ready .hero__title .line:nth-child(1) .w{transform:translateY(0);}
.is-ready .hero__title .line:nth-child(2) .w{transform:translateY(0);transition-delay:.08s;}
.is-ready .hero__title .w{transition-delay:calc(var(--i,0) * .05s);}

@media(prefers-reduced-motion:reduce){
  *{animation:none!important;transition:none!important;}
  .hero__title .w{transform:none!important;}
  .reveal-fade,.reveal-line{opacity:1!important;transform:none!important;}
  [data-reveal-words] .word{opacity:1!important;}
}