/* FOAAP — site styles. Original code; colours and motion from the FOAAP design system. */
:root{
 --foaap-foundation:#060A18;--foaap-cream:#EEF2F9;--foaap-signal:#3D6BFF;
 --midnight:#0B1640;--ice:#9CCBFF;--violet:#7A5CFF;--ember:#FF7A45;
 --ink-muted:rgba(238,242,249,.70);--ink-muted-dark:rgba(6,10,24,.66);
 --rule:rgba(156,203,255,.18);--rule-dark:rgba(6,10,24,.16);
 --gutter:32px;--header:72px;
 --font:"neue-haas-grotesk-display","Neue Haas Grotesk Display Pro","Neue Haas Grotesk Display","Inter Tight","Helvetica Neue",Helvetica,Arial,sans-serif;
 --mono:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
 color-scheme:dark;
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-padding-top:var(--header)}
body{margin:0;background:var(--foaap-foundation);color:var(--foaap-cream);font-family:var(--font);font-weight:400;font-size:17px;line-height:1.45;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;overflow-x:hidden}
img,video,svg{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
h1,h2,h3,p{margin:0}
::selection{background:var(--foaap-signal);color:var(--foaap-cream)}
:focus-visible{outline:2px solid var(--foaap-signal);outline-offset:4px}
.wrap{width:100%;max-width:1600px;margin:0 auto;padding:0 var(--gutter)}
.grid{display:grid;grid-template-columns:1fr 1fr;gap:var(--gutter)}

/* type */
.label{font-size:13px;letter-spacing:.02em;text-transform:uppercase;font-weight:400}
.display{font-size:clamp(42px,5.2vw,76px);line-height:1.03;letter-spacing:-.045em;font-weight:400;max-width:17ch}
.h1{font-size:clamp(40px,5.6vw,80px);line-height:1.04;letter-spacing:-.04em;font-weight:400;max-width:20ch}
.h2{font-size:clamp(30px,3.4vw,44px);line-height:1.08;letter-spacing:-.03em;font-weight:400}
.h3{font-size:clamp(26px,2.5vw,36px);line-height:1.12;letter-spacing:-.025em;font-weight:400}
.prose p{margin-top:16px;font-size:17px;line-height:1.45}
.prose p:first-child{margin-top:56px}

/* tones */
.tone-dark{background:var(--foaap-foundation);color:var(--foaap-cream)}
.tone-light{background:var(--foaap-cream);color:var(--foaap-foundation)}

/* header */
.site-header{position:fixed;inset:0 0 auto;z-index:50;height:var(--header);background:var(--foaap-foundation);color:var(--foaap-cream);transition:box-shadow .3s}
.site-header.scrolled{box-shadow:0 1px 0 var(--rule)}
.header-row{height:100%;display:grid;grid-template-columns:1fr auto 1fr;align-items:center}
.logo{display:inline-flex;align-items:center;gap:10px;font-size:24px;letter-spacing:-.02em;font-weight:400;justify-self:start}
.logo svg{width:14px;height:16px;fill:currentColor}
.nav-main{display:flex;gap:42px;font-size:15px}
.nav-main a,.nav-company{position:relative;padding:6px 0}
.nav-main a::after,.nav-company::after{content:"";position:absolute;left:0;right:0;bottom:-2px;height:2px;background:var(--foaap-signal);transform:scaleX(0);transform-origin:left;transition:transform .35s cubic-bezier(.2,.7,.2,1)}
.nav-main a:hover::after,.nav-main a[aria-current]::after,.nav-company:hover::after,.nav-company[aria-current]::after{transform:scaleX(1)}
.nav-company{justify-self:end;font-size:15px}
.nav-company span{margin-left:6px;font-size:18px;line-height:0;position:relative;top:1px}
.nav-toggle{display:none;justify-self:end;width:40px;height:40px;background:none;border:0;padding:0;cursor:pointer;color:inherit}
.nav-toggle span{display:block;width:26px;height:1.5px;background:currentColor;margin:6px auto;transition:transform .3s}
body.menu-open .nav-toggle span:first-child{transform:translateY(3.75px) rotate(45deg)}
body.menu-open .nav-toggle span:last-child{transform:translateY(-3.75px) rotate(-45deg)}
.mobile-menu{display:none}

/* home hero */
main{padding-top:var(--header)}
.home-hero .film{border-radius:2px;overflow:hidden;background:#000;aspect-ratio:5/2}
.home-hero video{width:100%;height:100%;object-fit:cover}
.home-hero .label{margin-top:56px}
.hero-foot{display:flex;align-items:flex-end;justify-content:space-between;gap:24px;margin-top:20px;padding-bottom:88px}
.arrow{width:28px;height:28px;flex:none;fill:none;stroke:currentColor;stroke-width:1.6}
.tech-hero img{width:100%;height:auto;border-radius:2px}
.tech-hero .label{margin-top:56px}

/* page hero */
.page-hero .wrap{min-height:calc(78vh - var(--header));display:flex;flex-direction:column;padding-top:110px}
.page-hero .display{margin-top:36px}
.page-hero .hero-foot{margin-top:auto;padding:80px 0 72px;align-items:flex-end}
.page-hero .hero-foot p{font-size:15px;max-width:22ch;line-height:1.3}

/* sections */
.cols{padding:84px 0 110px}
.cols .col-body{max-width:720px}
.tone-dark .prose p{color:var(--ink-muted)}
.tone-dark .prose p:first-child{color:var(--foaap-cream)}
.tone-light .prose p{color:var(--ink-muted-dark)}
.tone-light .prose p:first-child{color:var(--foaap-foundation)}
.statement{padding:120px 0 40px}
.statement .h1{margin-top:28px}
.actions{display:flex;flex-wrap:wrap;gap:28px;margin-top:28px}
.text-link{display:inline-flex;align-items:center;gap:10px;font-size:15px;border-bottom:1px solid currentColor;padding-bottom:3px;opacity:.85;transition:opacity .2s}
.text-link:hover{opacity:1}
.arrow-out{width:11px;height:11px;fill:none;stroke:var(--foaap-signal);stroke-width:1.4;transition:transform .25s}
.text-link:hover .arrow-out{transform:translate(2px,-2px)}

/* rows */
.rows{padding:24px 0 90px}
.FeatureSliceBlock{position:relative;border-radius:2px}
.FeatureSliceBlock>.border{position:absolute;left:0;right:0;top:0;height:1px;background:currentColor;opacity:.25}
.FeatureSliceBlock>.container{display:grid;grid-template-columns:1fr 1fr 1fr;gap:var(--gutter);padding:26px 20px 52px}
.FeatureSliceBlock .headline{font-size:clamp(28px,2.6vw,36px);line-height:1.08;letter-spacing:-.03em;font-weight:400;max-width:12ch}
.FeatureSliceBlock .subheadline{font-size:14px;text-transform:uppercase;letter-spacing:-.005em;padding-top:8px}
.FeatureSliceBlock .description{font-size:15px;line-height:1.3;padding-top:8px;max-width:44ch}
.row-link{margin-top:18px}
.tone-light .FeatureSliceBlock.foaap-project{background:var(--foaap-cream);color:var(--foaap-foundation)}

/* award */
.award{padding:0 0 30px}
.award-row{display:grid;grid-template-columns:auto 1fr auto;gap:28px;align-items:center;border-top:1px solid var(--rule);border-bottom:1px solid var(--rule);padding-top:28px;padding-bottom:28px}
.award-mark{width:64px;height:64px;border:1px solid var(--foaap-signal);border-radius:50%;display:grid;place-items:center;font-size:28px;letter-spacing:-.03em;color:var(--foaap-cream)}
.award-text{font-size:clamp(20px,1.8vw,26px);letter-spacing:-.02em;margin-top:8px}

/* method */
.method{padding:100px 0 110px;border-top:1px solid var(--rule)}
.method-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--gutter);margin-top:72px}
.method-cell{border-top:1px solid var(--rule);padding-top:22px}
.method-n{font-family:var(--mono);font-size:12px;color:var(--foaap-signal);margin-bottom:28px}
.method-cell h3{font-size:22px;letter-spacing:-.02em;font-weight:400;line-height:1.15}
.method-cell p{font-size:15px;line-height:1.35;color:var(--ink-muted);margin-top:12px}

/* footer */
.site-footer{background:var(--foaap-foundation);color:var(--foaap-cream);border-top:1px solid var(--rule);padding:72px 0 36px}
.footer-grid{display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:var(--gutter)}
.footer-grid .label{opacity:.6;margin-bottom:16px}
.footer-grid a:not(.logo){display:block;font-size:15px;margin-bottom:10px;opacity:.9}
.footer-grid a:not(.logo):hover{opacity:1;text-decoration:underline;text-decoration-color:var(--foaap-signal);text-underline-offset:5px}
.footer-logo{align-self:start}
.footer-base{margin-top:96px;font-size:13px;opacity:.6}

/* reveal */
.reveal{opacity:0;transform:translateY(18px);transition:opacity .9s cubic-bezier(.2,.7,.2,1),transform .9s cubic-bezier(.2,.7,.2,1)}
.reveal.in{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){.reveal{opacity:1;transform:none;transition:none}}

/* responsive */
@media (max-width:1100px){.method-grid{grid-template-columns:1fr 1fr}.nav-main{gap:28px}}
@media (max-width:860px){
 :root{--gutter:20px;--header:64px}
 .nav-main,.nav-company{display:none}
 .nav-toggle{display:block}
 .header-row{grid-template-columns:1fr auto}
 .mobile-menu{position:fixed;inset:var(--header) 0 0;background:var(--foaap-foundation);padding:32px var(--gutter);display:flex;flex-direction:column;gap:6px;opacity:0;visibility:hidden;transition:opacity .25s,visibility .25s}
 .mobile-menu a{font-size:34px;letter-spacing:-.03em;padding:6px 0}
 .mobile-menu a:last-child{font-size:16px;margin-top:auto;opacity:.7}
 body.menu-open{overflow:hidden}
 body.menu-open .mobile-menu{opacity:1;visibility:visible}
 .grid{grid-template-columns:1fr;gap:20px}
 .prose p:first-child{margin-top:28px}
 .cols{padding:56px 0 72px}
 .statement{padding:80px 0 24px}
 .FeatureSliceBlock>.container{grid-template-columns:1fr;gap:10px;padding:22px 12px 40px}
 .footer-grid{grid-template-columns:1fr 1fr}
 .footer-logo{grid-column:1/-1;margin-bottom:12px}
 .award-row{grid-template-columns:auto 1fr;}
 .award-row .text-link{grid-column:1/-1;justify-self:start}
 .page-hero .wrap{padding-top:64px;min-height:calc(70vh - var(--header))}
 .hero-foot{padding-bottom:56px}
}
@media (max-width:767px){.home-hero .film{aspect-ratio:1/1}}
@media (max-width:560px){.method-grid{grid-template-columns:1fr}}

/* ---- FOAAP interaction layer (project rows, motifs, vision field) ---- */
.FeatureSliceBlock.foaap-project {position:relative;isolation:isolate;overflow:hidden;background:var(--foaap-foundation);color:var(--foaap-cream);cursor:default;}
.foaap-project > .container {position:relative;z-index:1;}
.foaap-project > .border {z-index:2;}
.foaap-row-mesh {position:absolute;inset:0;width:100%;height:100%;pointer-events:none;z-index:0;opacity:0;transition:opacity 650ms ease;-webkit-mask-image:linear-gradient(to bottom,transparent,rgba(0,0,0,.2) 48px,#000 120px);mask-image:linear-gradient(to bottom,transparent,rgba(0,0,0,.2) 48px,#000 120px);}
.foaap-project.foaap-hovered .foaap-row-mesh {opacity:1;}
.foaap-row-mesh[data-pattern="code"] {-webkit-mask-image:linear-gradient(to bottom,transparent,#000 36px);mask-image:linear-gradient(to bottom,transparent,#000 36px);}
.foaap-project > .border {background-color:var(--foaap-cream) !important;opacity:.25;}
.foaap-project > .container {padding-left:20px;padding-right:20px;}
.foaap-project .description {padding-right:100px;}
/* Protect every text column while leaving the particle field bright in open space. */
.foaap-project :is(.headline,.subheadline,.description) {position:relative;isolation:isolate;text-shadow:0 1px 3px var(--foaap-foundation);}
.foaap-project :is(.headline,.subheadline,.description)::before {content:"";position:absolute;inset:-5px;z-index:-1;background:rgba(6,10,24,.88);filter:blur(7px);pointer-events:none;}
.foaap-motif {position:absolute;z-index:2;right:18px;top:24px;width:64px;height:64px;color:var(--foaap-signal);pointer-events:none;overflow:visible;}
.foaap-motif .trace {fill:none;stroke:currentColor;stroke-width:1;stroke-dasharray:1;stroke-dashoffset:1;opacity:.25;transition:stroke-dashoffset 700ms ease,opacity 420ms ease;}
.foaap-motif .point {fill:currentColor;opacity:.8;transform:translate(var(--dx),var(--dy));transition:transform 650ms cubic-bezier(.2,.7,.2,1),opacity 420ms ease;transition-delay:var(--delay);}
.foaap-project.foaap-hovered .trace {stroke-dashoffset:0;opacity:.8;}
.foaap-project.foaap-hovered .point {transform:translate(0,0);opacity:1;}
@media (max-width:767px) {
 .foaap-project > .container {padding-left:12px;padding-right:12px;}
 .foaap-project .headline {padding-right:70px;}
 .foaap-project .description {padding-right:0;}
 .foaap-motif {width:44px;height:44px;right:12px;top:20px;}
}
@media (prefers-reduced-motion:reduce) {
 .FeatureSliceBlock.foaap-project,.foaap-row-mesh,.foaap-motif .trace,.foaap-motif .point {transition:none;}
 .foaap-motif .point {transform:none;}
 .foaap-motif .trace {stroke-dashoffset:0;}
}
.foaap-vision-field {position:relative;min-height:560px;display:grid;place-items:center;overflow:hidden;border-top:1px solid rgba(156,203,255,.18);border-bottom:1px solid rgba(156,203,255,.18);background:#060A18;margin-top:48px;padding:100px 24px;}
.foaap-vision-field canvas {position:absolute;inset:0;width:100%;height:100%;pointer-events:none;mask-image:linear-gradient(transparent,#000 12%,#000 88%,transparent);}
.foaap-vision-copy {position:relative;max-width:850px;text-align:center;background:radial-gradient(ellipse,#060A18 35%,transparent 72%);padding:50px 20px;}
.foaap-vision-copy .eyebrow {font-size:13px;letter-spacing:.12em;margin-bottom:28px;}
.foaap-vision-copy h2 {font-size:clamp(36px,5vw,76px);line-height:1.04;letter-spacing:-.045em;margin:0 0 28px;color:#EEF2F9;}
.foaap-vision-copy p {font-size:clamp(17px,1.6vw,23px);line-height:1.4;max-width:650px;margin:auto;color:rgba(238,242,249,.78);}
.foaap-vision-copy .origin {margin-top:32px;font-size:14px;}
@media(max-width:767px){.foaap-vision-field{min-height:540px;padding:50px 12px}.foaap-vision-copy{padding:35px 10px}}

/* ---- images ---- */
figure{margin:0}
.image-band{padding:0 0 96px}
.image-band .frame{overflow:hidden;border-radius:2px;aspect-ratio:5/2;background:#000}
.image-band img{width:100%;height:100%;object-fit:cover;transform:scale(1.04);transition:transform 1.6s cubic-bezier(.2,.7,.2,1)}
.image-band .frame.in img{transform:none}
.image-band figcaption{margin-top:16px;max-width:60ch;opacity:.75;text-transform:none;font-size:14px;letter-spacing:0}
.tone-light+.image-band{padding-top:96px}
.statement+.image-band{background:var(--foaap-cream);padding-top:24px}
.statement+.image-band figcaption{color:var(--foaap-foundation)}
.page-hero+.image-band{padding-top:0}
.tech-hero picture,.tech-hero img{display:block;width:100%;height:auto;border-radius:2px}
@media (max-width:860px){.image-band{padding-bottom:56px}.image-band .frame{aspect-ratio:4/3}}
@media (prefers-reduced-motion:reduce){.image-band img{transform:none;transition:none}}

/* ---- company panel ---- */
button.nav-company{background:none;border:0;color:inherit;font:inherit;font-size:15px;cursor:pointer}
.nav-company span{display:inline-block;transition:transform .3s}
.nav-company[aria-expanded="true"] span{transform:rotate(45deg)}
.nav-company[aria-expanded="true"]::after{transform:scaleX(1)}
.company-panel{position:absolute;left:0;right:0;top:var(--header);background:var(--foaap-foundation);border-top:1px solid var(--rule);border-bottom:1px solid var(--rule);padding:48px 0 56px;animation:panel-in .35s cubic-bezier(.2,.7,.2,1)}
.company-panel[hidden]{display:none}
.company-panel .label{opacity:.6;margin-bottom:18px}
.panel-lead{font-size:clamp(22px,2vw,30px);letter-spacing:-.025em;line-height:1.15;max-width:24ch}
.panel-note{margin-top:18px;font-size:15px;color:var(--ink-muted)}
.panel-links{display:flex;flex-direction:column;gap:6px;margin-bottom:28px}
.panel-links a{font-size:24px;letter-spacing:-.02em;width:max-content}
.panel-links a:hover{color:#fff;text-decoration:underline;text-decoration-color:var(--foaap-signal);text-decoration-thickness:2px;text-underline-offset:6px}
@keyframes panel-in{from{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion:reduce){.company-panel{animation:none}}
@media (max-width:860px){.company-panel{display:none !important}}

/* ---- aurora (colour direction: navy, electric blue, ice, violet, ember) ---- */
.aurora{position:relative;isolation:isolate;overflow:hidden}
.aurora::before{content:"";position:absolute;inset:0;z-index:-2;pointer-events:none;
 background:
  radial-gradient(60% 55% at 50% 118%,rgba(255,122,69,.55),transparent 70%),
  radial-gradient(55% 70% at 50% 100%,rgba(156,203,255,.55),transparent 72%),
  radial-gradient(70% 80% at 50% 95%,rgba(61,107,255,.75),transparent 75%),
  radial-gradient(40% 60% at 12% 70%,rgba(122,92,255,.45),transparent 70%),
  radial-gradient(40% 60% at 88% 70%,rgba(122,92,255,.35),transparent 70%),
  linear-gradient(180deg,var(--foaap-foundation) 0%,var(--midnight) 100%)}
.aurora::after{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;opacity:.35;
 background:repeating-linear-gradient(90deg,rgba(6,10,24,.0) 0 3px,rgba(6,10,24,.55) 3px 4px);
 -webkit-mask-image:linear-gradient(180deg,transparent 10%,#000 70%);mask-image:linear-gradient(180deg,transparent 10%,#000 70%)}
.aurora.aurora-soft::before{opacity:.55}
.page-hero.aurora .hero-foot p{color:var(--foaap-cream)}
.award-mark{border-color:var(--ice);box-shadow:0 0 24px rgba(61,107,255,.45),inset 0 0 18px rgba(122,92,255,.35)}
.method-n{color:var(--ice)}
.arrow-out{stroke:var(--ice)}
.tone-light .arrow-out{stroke:var(--foaap-signal)}
.nav-main a::after,.nav-company::after{background:linear-gradient(90deg,var(--foaap-signal),var(--violet))}
.site-header{background:rgba(6,10,24,.86);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px)}
.company-panel{background:linear-gradient(180deg,#060A18,#0B1640)}
.site-footer{background:radial-gradient(60% 120% at 85% 120%,rgba(61,107,255,.22),transparent 70%),var(--foaap-foundation)}
::selection{background:var(--violet)}

/* ---- dawn light sections (soft lavender / pink / ice over white) ---- */
:root{--dawn-ink:#0B1029;--dawn-muted:rgba(11,16,41,.66)}
.tone-light{color:var(--dawn-ink);
 background:
  radial-gradient(55% 80% at 100% 0%,rgba(122,92,255,.16),transparent 70%),
  radial-gradient(45% 70% at 0% 100%,rgba(255,143,199,.14),transparent 70%),
  radial-gradient(60% 90% at 70% 110%,rgba(156,203,255,.22),transparent 70%),
  linear-gradient(180deg,#F7F6FD 0%,#F1F0FB 100%)}
.tone-light .label{color:#5B3FE0;letter-spacing:.04em}
.tone-light .prose p{color:var(--dawn-muted)}
.tone-light .prose p:first-child{color:var(--dawn-ink)}
.tone-light .h1,.tone-light .h3{background:linear-gradient(100deg,#0B1029 0%,#1B1F5E 55%,#4B2FD0 100%);-webkit-background-clip:text;background-clip:text;color:transparent}
.tone-light .text-link{opacity:1;border-bottom:1px solid rgba(91,63,224,.45)}
.tone-light .text-link:hover{border-bottom-color:#5B3FE0}
.tone-light .arrow-out{stroke:#5B3FE0}
.tone-dark+.tone-light{position:relative}
.tone-dark+.tone-light::before{content:"";position:absolute;left:0;right:0;top:0;height:2px;background:linear-gradient(90deg,transparent,rgba(122,92,255,.55),rgba(255,143,199,.45),rgba(156,203,255,.55),transparent);pointer-events:none}
.statement.tone-light+.image-band{background:linear-gradient(180deg,#F1F0FB 0%,#F1F0FB 55%,var(--foaap-foundation) 55%)}
.statement+.image-band figcaption{color:var(--foaap-cream)}

/* ==== One palette: navy + blue/ice/orange aurora; pink only on hover ==== */
:root{--pink:#FF8FC7;--orange:#FF7A45}
/* every section is the same navy surface; sections are separated by hairlines, not by colour */
.tone-light{background:var(--foaap-foundation);color:var(--foaap-cream);box-shadow:none}
.tone-dark+.tone-light::before{display:none}
.cols,.statement,.rows,.method,.award{border-top:1px solid var(--rule)}
.statement+.image-band,.image-band{border-top:0}
.cols+.cols,.statement{border-top:1px solid var(--rule)}
.tone-light .label,.label{color:rgba(156,203,255,.85)}
.tone-light .prose p{color:var(--ink-muted)}
.tone-light .prose p:first-child{color:var(--foaap-cream)}
.tone-light .h1,.tone-light .h3{background:none;color:var(--foaap-cream)}
.statement .h1{background:linear-gradient(100deg,#EEF2F9 0%,#CFE3FF 60%,#9CCBFF 100%);-webkit-background-clip:text;background-clip:text;color:transparent}
.tone-light .text-link{border-bottom:1px solid currentColor;opacity:.85}
.tone-light .arrow-out,.arrow-out{stroke:var(--ice)}
.statement.tone-light+.image-band{background:var(--foaap-foundation)}
.tone-light .FeatureSliceBlock.foaap-project{background:var(--foaap-foundation);color:var(--foaap-cream)}

/* aurora: deep blue rising into ice, a warm orange floor (no violet) */
.aurora::before{background:
  radial-gradient(70% 45% at 50% 112%,rgba(255,122,69,.70),transparent 70%),
  radial-gradient(45% 60% at 50% 100%,rgba(176,222,255,.75),transparent 70%),
  radial-gradient(75% 85% at 50% 98%,rgba(46,110,255,.85),transparent 74%),
  radial-gradient(35% 70% at 15% 85%,rgba(30,70,200,.45),transparent 70%),
  radial-gradient(35% 70% at 85% 85%,rgba(30,70,200,.45),transparent 70%),
  linear-gradient(180deg,var(--foaap-foundation) 0%,#081440 100%)}
.aurora::after{opacity:.45}
.aurora.aurora-soft::before{opacity:.5}
.award-mark{border-color:var(--ice);box-shadow:0 0 24px rgba(61,107,255,.45),inset 0 0 18px rgba(255,122,69,.25)}
.company-panel{background:linear-gradient(180deg,#060A18,#081440)}
.site-footer{background:radial-gradient(60% 120% at 50% 130%,rgba(255,122,69,.18),transparent 70%),radial-gradient(60% 120% at 50% 120%,rgba(46,110,255,.22),transparent 70%),var(--foaap-foundation)}
::selection{background:var(--foaap-signal);color:#fff}

/* pink: hover accents only */
.nav-main a::after,.nav-company::after{background:var(--foaap-signal)}
.nav-main a:hover::after,.nav-company:hover::after{background:var(--pink)}
.text-link{transition:opacity .2s,border-color .2s,color .2s}
.text-link:hover,.tone-light .text-link:hover{border-bottom-color:var(--pink);opacity:1}
.text-link:hover .arrow-out{stroke:var(--pink)}
.panel-links a:hover,.footer-grid a:not(.logo):hover{text-decoration-color:var(--pink)}
.foaap-project.foaap-hovered .foaap-motif{color:var(--pink)}
:focus-visible{outline-color:var(--pink)}
/* aurora strength, closer to the reference */
.page-hero.aurora::before{background:
  radial-gradient(80% 38% at 50% 108%,rgba(255,122,69,.85),transparent 72%),
  radial-gradient(42% 70% at 50% 100%,rgba(190,228,255,.95),transparent 70%),
  radial-gradient(85% 95% at 50% 100%,rgba(46,110,255,1),transparent 76%),
  radial-gradient(40% 80% at 12% 100%,rgba(30,70,220,.6),transparent 70%),
  radial-gradient(40% 80% at 88% 100%,rgba(30,70,220,.6),transparent 70%),
  linear-gradient(180deg,var(--foaap-foundation) 0%,#0A1A55 100%)}
.page-hero.aurora .hero-foot p{text-shadow:0 1px 8px rgba(6,10,24,.6)}

/* ==== Sun-kissed: one continuous light behind the whole page ==== */
/* Sections are transparent; a single page-wide glow layer carries all colour. */
body{position:relative;isolation:isolate;--sun-y:78vh}
body.page-home{--sun-y:calc(40vw + 250px)}
body.page-technology{--sun-y:calc(56vw + 230px)}
body.page-capabilities{--sun-y:80vh}
body.page-company{--sun-y:74vh}
body.page-work-with-us{--sun-y:76vh}
@media (max-width:767px){
 body.page-home{--sun-y:calc(100vw + 220px)}
 body.page-technology{--sun-y:calc(75vw + 230px)}
}
body::before{content:"";position:absolute;inset:0;z-index:-2;pointer-events:none;
 background:
  /* the sun: orange core, ice halo, wide blue sky */
  radial-gradient(60vw 420px at 50% calc(var(--sun-y) + 40px),rgba(255,122,69,.62),transparent 70%),
  radial-gradient(36vw 380px at 50% var(--sun-y),rgba(190,228,255,.55),transparent 70%),
  radial-gradient(95vw 900px at 50% var(--sun-y),rgba(46,110,255,.72),transparent 72%),
  /* warm afterglow drifting down the page */
  radial-gradient(70vw 1100px at 100% calc(var(--sun-y) + 1300px),rgba(255,122,69,.16),transparent 70%),
  radial-gradient(70vw 1100px at 0% calc(var(--sun-y) + 2100px),rgba(46,110,255,.22),transparent 70%),
  radial-gradient(60vw 900px at 85% calc(var(--sun-y) + 3000px),rgba(255,143,120,.12),transparent 70%),
  /* second sunrise at the foot of the page */
  radial-gradient(80vw 520px at 50% 100%,rgba(255,122,69,.40),transparent 70%),
  radial-gradient(100vw 800px at 50% 100%,rgba(46,110,255,.45),transparent 72%),
  var(--foaap-foundation)}
/* fine vertical light-streaks over the glow, like the reference */
body::after{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;opacity:.32;
 background:repeating-linear-gradient(90deg,transparent 0 3px,rgba(6,10,24,.55) 3px 4px)}
.tone-dark,.tone-light,.site-footer,.statement.tone-light+.image-band,.foaap-vision-field,
.FeatureSliceBlock.foaap-project,.tone-light .FeatureSliceBlock.foaap-project{background:transparent}
.aurora::before,.aurora::after{display:none}
.foaap-project :is(.headline,.subheadline,.description)::before{background:rgba(6,10,24,.45)}
/* quieter dividers; light does the separating */
.cols,.statement,.rows,.method,.award,.site-footer,.cols+.cols{border-top-color:rgba(156,203,255,.09)}
.award-row,.method-cell{border-color:rgba(156,203,255,.14)}
.image-band .frame{box-shadow:0 30px 120px -20px rgba(46,110,255,.35),0 10px 60px -10px rgba(255,122,69,.18)}
.site-header{background:rgba(6,10,24,.72)}

/* ==== Home hero: Portuguese flag point field ==== */
.flag-hero{position:relative;height:calc(100vh - var(--header));min-height:560px;max-height:1100px;overflow:hidden}
.flag-canvas{position:absolute;inset:0;width:100%;height:100%;display:block}
.flag-scrim{position:absolute;inset:0;pointer-events:none;
 background:linear-gradient(0deg,rgba(6,10,24,.88) 0%,rgba(6,10,24,.45) 20%,transparent 40%),
  linear-gradient(180deg,rgba(6,10,24,.6) 0%,transparent 14%)}
.flag-copy{position:absolute;left:0;right:0;bottom:0;margin:0 auto}
.flag-copy .hero-foot{padding-bottom:56px;margin-top:18px}
.flag-copy .display{max-width:18ch}
.flag-hero.no-gl{background:url(/assets/flag-pt.svg) center/cover no-repeat;filter:grayscale(1) brightness(.6)}
body.page-home{--sun-y:calc(100vh + 160px)}
/* Typography: the vision field heading uses the site's regular weight, like every other heading */
.foaap-vision-copy h2{font-family:var(--font);font-weight:400;letter-spacing:-.04em}
.foaap-vision-copy p{font-family:var(--font);font-weight:400}
.foaap-vision-copy .eyebrow{font-size:13px;letter-spacing:.02em}

/* ==== Home headline: a real title ==== */
.flag-copy .label{font-size:14px;letter-spacing:.08em;margin-bottom:6px}
.flag-copy .display{font-size:clamp(54px,8.2vw,140px);font-weight:500;line-height:.93;letter-spacing:-.058em;max-width:11.5ch;
 background:linear-gradient(180deg,#FFFFFF 30%,#CFE3FF 100%);-webkit-background-clip:text;background-clip:text;color:transparent;
 text-shadow:none;filter:drop-shadow(0 6px 30px rgba(6,10,24,.55))}
.flag-copy .hero-foot{padding-bottom:64px;align-items:flex-end}
@media (max-width:767px){.flag-copy .display{font-size:clamp(46px,13.5vw,64px)}}

/* ==== Sky: colour that rises as you scroll, spread across the page ==== */
body.page-home{--sun-y:-3000px}  /* no fixed sun under the flag; the sky brings the colour */
.sky{position:fixed;inset:0;z-index:-1;pointer-events:none;overflow:hidden;
 opacity:var(--reveal,1);transform:translate3d(0,calc((1 - var(--reveal,1)) * 22vh),0);will-change:opacity,transform}
.sky i{position:absolute;display:block;border-radius:50%;filter:blur(70px);animation:drift 26s ease-in-out infinite alternate}
.sky i:nth-child(1){left:-18vw;bottom:-28vh;width:62vw;height:62vh;background:radial-gradient(closest-side,rgba(255,122,69,.55),transparent);animation-duration:31s}
.sky i:nth-child(2){right:-20vw;bottom:-22vh;width:60vw;height:58vh;background:radial-gradient(closest-side,rgba(255,138,110,.42),transparent);animation-duration:37s;animation-delay:-9s}
.sky i:nth-child(3){left:-10vw;top:12vh;width:58vw;height:70vh;background:radial-gradient(closest-side,rgba(46,110,255,.42),transparent);animation-duration:34s;animation-delay:-4s}
.sky i:nth-child(4){right:-12vw;top:-12vh;width:56vw;height:66vh;background:radial-gradient(closest-side,rgba(60,120,255,.36),transparent);animation-duration:29s;animation-delay:-14s}
.sky i:nth-child(5){left:22vw;bottom:-40vh;width:56vw;height:50vh;background:radial-gradient(closest-side,rgba(156,203,255,.22),transparent);animation-duration:41s;animation-delay:-20s}
@keyframes drift{
 0%{transform:translate3d(0,0,0) scale(1)}
 50%{transform:translate3d(6vw,-5vh,0) scale(1.12)}
 100%{transform:translate3d(-5vw,4vh,0) scale(.94)}}
@media (prefers-reduced-motion:reduce){.sky i{animation:none}}
/* page heroes: a wide horizon instead of a narrow central sun */
body:not(.page-home)::before{background:
  radial-gradient(130vw 420px at 50% calc(var(--sun-y) + 60px),rgba(255,122,69,.38),transparent 70%),
  radial-gradient(150vw 820px at 50% var(--sun-y),rgba(46,110,255,.58),transparent 72%),
  radial-gradient(90vw 500px at 50% calc(var(--sun-y) + 10px),rgba(190,228,255,.28),transparent 70%),
  var(--foaap-foundation)}
body.page-home::before{background:var(--foaap-foundation)}

/* Project rows: no dark boxes behind the text; a soft text shadow keeps it readable over the hover dots */
.foaap-project :is(.headline,.subheadline,.description)::before{display:none}
.foaap-project :is(.headline,.subheadline,.description){text-shadow:0 1px 14px rgba(6,10,24,.55),0 0 2px rgba(6,10,24,.35)}
.foaap-row-mesh{opacity:0}
.foaap-project.foaap-hovered .foaap-row-mesh{opacity:.55}

/* Award mark: ring of twelve EU stars around 3rd */
.award-mark{width:92px;height:92px;border:0;border-radius:0;box-shadow:none;background:none;display:block;overflow:visible}
.award-stars{fill:var(--foaap-cream);opacity:.85}
.award-n{font-family:var(--font);font-size:30px;font-weight:400;letter-spacing:-.04em;fill:var(--foaap-cream)}
.award-sup{font-family:var(--font);font-size:8px;font-weight:500;letter-spacing:.06em;fill:var(--ice)}
.award-row:hover .award-stars{fill:var(--pink);transition:fill .3s}

/* ==== Cool pages: Our Technology and Work With Us use a baby-blue core instead of orange ==== */
body:is(.page-technology,.page-work-with-us)::before{background:
  radial-gradient(70vw 460px at 50% calc(var(--sun-y) + 70px),rgba(150,220,255,.85),transparent 70%),
  radial-gradient(38vw 520px at 50% calc(var(--sun-y) + 40px),rgba(205,240,255,.55),transparent 70%),
  radial-gradient(150vw 900px at 50% var(--sun-y),rgba(40,110,255,.75),transparent 72%),
  radial-gradient(60vw 1000px at 0% calc(var(--sun-y) + 1400px),rgba(110,190,255,.18),transparent 70%),
  radial-gradient(60vw 1000px at 100% calc(var(--sun-y) + 2300px),rgba(40,110,255,.22),transparent 70%),
  var(--foaap-foundation)}
body:is(.page-technology,.page-work-with-us) .sky i:nth-child(1){background:radial-gradient(closest-side,rgba(130,205,255,.50),transparent)}
body:is(.page-technology,.page-work-with-us) .sky i:nth-child(2){background:radial-gradient(closest-side,rgba(165,225,255,.40),transparent)}
body:is(.page-technology,.page-work-with-us) .sky i:nth-child(5){background:radial-gradient(closest-side,rgba(200,238,255,.30),transparent)}
body:is(.page-technology,.page-work-with-us) .site-footer{background:radial-gradient(60% 120% at 50% 130%,rgba(150,220,255,.22),transparent 70%)}
body.page-technology{--sun-y:78vh}
@media (max-width:767px){body.page-technology{--sun-y:72vh}}
/* Cool pages: calmer core: less white, deeper blue, kept low so white text stays on blue */
body:is(.page-technology,.page-work-with-us)::before{background:
  radial-gradient(60vw 360px at 50% calc(var(--sun-y) + 150px),rgba(120,195,255,.55),transparent 70%),
  radial-gradient(28vw 300px at 50% calc(var(--sun-y) + 140px),rgba(175,225,255,.30),transparent 70%),
  radial-gradient(140vw 820px at 50% calc(var(--sun-y) + 80px),rgba(36,96,235,.62),transparent 72%),
  radial-gradient(60vw 1000px at 0% calc(var(--sun-y) + 1400px),rgba(110,190,255,.14),transparent 70%),
  radial-gradient(60vw 1000px at 100% calc(var(--sun-y) + 2300px),rgba(40,110,255,.18),transparent 70%),
  var(--foaap-foundation)}
body:is(.page-technology,.page-work-with-us)::after{opacity:.38}
.page-hero .display,.page-hero .hero-foot p{text-shadow:0 2px 24px rgba(6,10,24,.45)}
.award-by{margin-top:6px;font-size:13px;color:var(--ink-muted)}

/* ==== Code in the margins of Home ==== */
.rain{position:relative}
.rain canvas{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;z-index:0}
.rain-content{position:relative;z-index:1}
.rain .wrap{max-width:1080px}
/* text stays readable over the rain */

/* ==== language switch ==== */
.nav-right{justify-self:end;display:flex;align-items:center;gap:26px}
.lang-switch{font-family:var(--mono);font-size:12px;letter-spacing:.08em;color:rgba(238,242,249,.6);display:inline-flex;gap:5px;padding:6px 0;position:relative}
.lang-switch .lang-on{color:var(--foaap-cream)}
.lang-switch .lang-sep{opacity:.4}
.lang-switch:hover{color:var(--pink)}
.lang-switch::after{content:"";position:absolute;left:0;right:0;bottom:-2px;height:2px;background:var(--pink);transform:scaleX(0);transform-origin:left;transition:transform .35s cubic-bezier(.2,.7,.2,1)}
.lang-switch:hover::after{transform:scaleX(1)}
.mobile-menu .lang-switch{font-size:16px;margin-top:auto;padding:12px 0}
@media (max-width:860px){.nav-right{display:none}}
.mobile-menu{z-index:60;background:var(--foaap-foundation)}
body.menu-open .flag-hero{visibility:hidden}
