:root {
  --bg: #07090c;
  --bg-soft: #0d1014;
  --text: #f5f7f8;
  --muted: #aeb4bc;
  --line: rgba(255,255,255,.14);
  --pad: clamp(24px, 5vw, 78px);
  --ease: cubic-bezier(.22,.78,.24,1);
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; background: var(--bg); }
body { margin: 0; background: var(--bg); color: var(--text); font-family: Manrope, Arial, sans-serif; overflow-x: hidden; }
a { color: inherit; text-decoration: none; }
img { display: block; width: 100%; }
::selection { background: var(--text); color: var(--bg); }

.scroll-progress { position: fixed; inset: 0 auto auto 0; z-index: 1100; width: 100%; height: 2px; transform: scaleX(0); transform-origin: left; background: #fff; pointer-events: none; }

.intro { position: fixed; inset: 0; z-index: 1000; background: #050608; display: grid; place-items: center; transition: opacity .9s ease, visibility .9s ease; }
.intro.is-hidden { opacity: 0; visibility: hidden; }
.intro__word { position: absolute; font-family: "Space Grotesk", sans-serif; letter-spacing: .12em; }
.intro__word--brand { font-size: clamp(44px, 8vw, 104px); text-transform: lowercase; animation: introBrand 3.1s both; }
.intro__word--motto { font-size: clamp(18px, 3vw, 42px); letter-spacing: .42em; animation: introMotto 3.1s both; }
@keyframes introBrand { 0%,10%{opacity:0;transform:translateY(12px)} 22%,47%{opacity:1;transform:none} 58%,100%{opacity:0;transform:translateY(-10px)} }
@keyframes introMotto { 0%,50%{opacity:0;transform:translateY(12px)} 64%,88%{opacity:1;transform:none} 100%{opacity:0} }

.site-header { position: fixed; inset: 0 0 auto; z-index: 50; padding: 24px var(--pad); display:flex; align-items:center; justify-content:space-between; color:#fff; transition: background .35s ease, transform .35s ease, padding .35s ease, backdrop-filter .35s ease; }
.site-header.is-scrolled { padding-top: 17px; padding-bottom: 17px; background: rgba(7,9,12,.72); backdrop-filter: blur(16px); border-bottom: 1px solid rgba(255,255,255,.08); }
.site-header.is-hidden { transform: translateY(-110%); }
.brand { font-family:"Space Grotesk",sans-serif; font-size:26px; letter-spacing:.08em; text-transform:lowercase; }
.desktop-nav { display:flex; gap:34px; margin-left:auto; }
.desktop-nav a { position:relative; font-size:10px; letter-spacing:.22em; color:rgba(255,255,255,.84); }
.desktop-nav a::after { content:""; position:absolute; left:0; right:100%; bottom:-7px; height:1px; background:#fff; transition:right .35s var(--ease); }
.desktop-nav a:hover::after { right:0; }
.menu-button { display:none; width:31px; height:24px; padding:0; border:0; background:none; align-content:center; gap:7px; cursor:pointer; }
.menu-button span { display:block; height:1px; background:#fff; transition:.3s; }
.menu-button[aria-expanded="true"] span:first-child { transform:translateY(4px) rotate(45deg); }
.menu-button[aria-expanded="true"] span:last-child { transform:translateY(-4px) rotate(-45deg); }

.mobile-menu { position:fixed; inset:0; z-index:40; background:#080a0d; padding:130px var(--pad) 48px; display:flex; flex-direction:column; gap:0; opacity:0; visibility:hidden; transition:.45s var(--ease); }
.mobile-menu.is-open { opacity:1; visibility:visible; }
.mobile-menu > a { display:flex; align-items:center; gap:18px; font-family:"Space Grotesk"; font-size:clamp(30px,8vw,64px); border-bottom:1px solid var(--line); padding:18px 0; transform:translateY(20px); opacity:0; transition:.45s var(--ease); }
.mobile-menu.is-open > a { transform:none; opacity:1; }
.mobile-menu.is-open > a:nth-child(2){transition-delay:.05s}.mobile-menu.is-open > a:nth-child(3){transition-delay:.1s}.mobile-menu.is-open > a:nth-child(4){transition-delay:.15s}
.mobile-menu small { font:400 10px Manrope; letter-spacing:.2em; color:var(--muted); }
.mobile-menu__social { margin-top:auto; display:flex; flex-wrap:wrap; gap:20px; font-size:11px; letter-spacing:.14em; }

.hero { min-height:100svh; position:relative; display:flex; align-items:center; overflow:hidden; background:#07090c; }
.hero__image { position:absolute; inset:0 auto 0 0; width:min(74vw,1420px); background:url('assets/athos-hero.webp') center center/cover no-repeat; transform:scale(1.025); transform-origin:left center; will-change:transform; }
.hero__shade { position:absolute; inset:0; background:linear-gradient(90deg,rgba(3,5,8,.10) 0%,rgba(3,5,8,.04) 46%,rgba(7,9,12,.72) 68%,#07090c 82%),linear-gradient(0deg,rgba(3,5,8,.68),transparent 55%); }
.hero__grain { position:absolute; inset:0; opacity:.12; pointer-events:none; background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.35'/%3E%3C/svg%3E"); mix-blend-mode:soft-light; }
.hero__content { position:relative; z-index:2; width:100%; padding:0 var(--pad); display:flex; justify-content:flex-end; transform:translateY(1.5vh); }
.hero h1 { margin:0; width:min(50vw,790px); font:400 clamp(70px,9.2vw,146px)/.84 "Space Grotesk",sans-serif; letter-spacing:-.062em; color:#fff; }
.hero-line { display:block; overflow:hidden; }
.hero-line > span { display:block; transform:translateY(110%); animation:heroLine 1.15s var(--ease) forwards; }
.hero-line:nth-child(2) > span { animation-delay:.12s; }
@keyframes heroLine { to { transform:none; } }
.scroll-cue { position:absolute; z-index:3; right:var(--pad); bottom:26px; display:flex; align-items:center; gap:12px; font-size:9px; letter-spacing:.24em; }
.scroll-cue i { display:block; width:50px; height:1px; background:#fff; animation:cue 1.7s ease-in-out infinite; transform-origin:left; }
@keyframes cue { 0%,100%{transform:scaleX(1);opacity:1} 50%{transform:scaleX(.35);opacity:.45} }

.section { padding:clamp(105px,14vw,190px) var(--pad); }
.section-label { display:flex; align-items:center; gap:14px; font-size:10px; letter-spacing:.28em; color:var(--muted); margin-bottom:clamp(55px,8vw,105px); }
.section-label span { color:#fff; }
.story-grid { display:grid; grid-template-columns:1.2fr .8fr; gap:8vw; align-items:start; }
.display { margin:0; font:400 clamp(52px,8.1vw,126px)/.9 "Space Grotesk",sans-serif; letter-spacing:-.055em; }
.story-copy { max-width:520px; font-size:clamp(17px,1.45vw,23px); line-height:1.75; color:#d8dbe0; }
.story-copy p { margin:0 0 28px; }
.story-copy strong { color:#fff; font-weight:500; }

.moving-line { overflow:hidden; border-top:1px solid var(--line); border-bottom:1px solid var(--line); padding:25px 0; }
.moving-line__track { width:max-content; display:flex; align-items:center; gap:30px; animation:marquee 28s linear infinite; font:400 clamp(24px,3.2vw,50px)/1 "Space Grotesk",sans-serif; letter-spacing:-.03em; white-space:nowrap; }
.moving-line__track i { width:6px; height:6px; border-radius:50%; background:#fff; opacity:.42; }
@keyframes marquee { to { transform:translateX(-50%); } }

.image-statement { min-height:96svh; position:relative; display:flex; align-items:center; overflow:hidden; }
.image-statement__frame { position:absolute; inset:0; overflow:hidden; clip-path:inset(7% 4% 7% 4% round 2px); transition:clip-path 1.3s var(--ease); }
.image-statement.is-inview .image-statement__frame { clip-path:inset(0 0 0 0); }
.image-statement__image { position:absolute; inset:-7%; background:url('assets/athos-stage.webp') center center/cover no-repeat; transform:scale(1.04); filter:brightness(.62) saturate(.78) contrast(1.04); will-change:transform; }
.image-statement__overlay { position:absolute; inset:0; background:linear-gradient(90deg,rgba(4,5,7,.88) 0%,rgba(4,5,7,.62) 34%,rgba(4,5,7,.26) 66%,rgba(4,5,7,.48) 100%),linear-gradient(0deg,rgba(4,5,7,.46),transparent 55%); }
.image-statement__text { position:relative; z-index:2; margin:0; padding:var(--pad); font:400 clamp(54px,9vw,142px)/.87 "Space Grotesk",sans-serif; letter-spacing:-.055em; }
.image-statement__text span { display:inline-block; transition:transform .5s var(--ease); }
.image-statement__text span:hover { transform:translateX(18px); }

.manifesto { display:grid; grid-template-columns:1.4fr .6fr; align-items:end; gap:7vw; border-bottom:1px solid var(--line); }
.manifesto__title { font:400 clamp(78px,13vw,210px)/.78 "Space Grotesk",sans-serif; letter-spacing:-.075em; color:transparent; -webkit-text-stroke:1px rgba(255,255,255,.48); }
.manifesto__copy { padding-bottom:1vw; font-size:14px; line-height:1.8; letter-spacing:.07em; color:#c8ccd2; }
.manifesto__copy p { margin:0; }
.manifesto__copy strong { display:block; margin-top:25px; color:#fff; }

.section--modalities { padding-bottom:30px; }
.modalities-list { border-top:1px solid var(--line); }
.modality { position:relative; display:grid; grid-template-columns:60px 1fr auto 34px; align-items:center; min-height:145px; border-bottom:1px solid var(--line); transition:padding .45s var(--ease), background .45s ease; overflow:hidden; }
.modality::before { content:""; position:absolute; inset:0; background:#f3f4f2; transform:scaleY(0); transform-origin:bottom; transition:transform .45s var(--ease); }
.modality > * { position:relative; z-index:1; transition:color .35s ease, transform .45s var(--ease); }
.modality:hover::before { transform:scaleY(1); }
.modality:hover { padding:0 18px; }
.modality:hover > * { color:#08090b; }
.modality:hover h3 { transform:translateX(10px); }
.modality__number { color:#858a92; font-size:11px; }
.modality h3 { margin:0; font:400 clamp(34px,5vw,76px)/1 "Space Grotesk",sans-serif; letter-spacing:-.04em; }
.modality p { color:var(--muted); font-size:13px; }
.modality b { font-weight:400; font-size:20px; }

.metrics { display:grid; grid-template-columns:repeat(4,1fr); border-top:1px solid var(--line); border-bottom:1px solid var(--line); }
.metric { min-height:220px; display:grid; place-content:center; text-align:center; border-right:1px solid var(--line); }
.metric:last-child { border-right:0; }
.metric strong { font:400 clamp(38px,5vw,78px)/1 "Space Grotesk",sans-serif; }
.metric span { margin-top:15px; color:var(--muted); font-size:9px; letter-spacing:.2em; }


.culture { position:relative; min-height:94svh; overflow:hidden; border-bottom:1px solid var(--line); display:flex; align-items:flex-end; padding:clamp(110px,14vw,190px) var(--pad); }
.culture__word { position:absolute; left:-.035em; top:50%; transform:translateY(-52%); white-space:nowrap; font:400 clamp(92px,19vw,320px)/.75 "Space Grotesk",sans-serif; letter-spacing:-.085em; color:transparent; -webkit-text-stroke:1px rgba(255,255,255,.16); opacity:.9; pointer-events:none; }
.culture__content { position:relative; z-index:2; width:min(900px,78vw); margin-left:auto; background:linear-gradient(110deg,rgba(7,9,12,.18),rgba(7,9,12,.88) 32%); padding-left:clamp(20px,4vw,70px); }
.culture__content .section-label { margin-bottom:42px; }
.culture__content .display { font-size:clamp(50px,7vw,112px); }
.culture__content p { max-width:650px; margin:40px 0 0 auto; color:#c7cbd1; font-size:clamp(16px,1.35vw,21px); line-height:1.75; }

.social { display:grid; grid-template-columns:.75fr 1.25fr; gap:8vw; }
.social__intro { position:sticky; top:130px; align-self:start; }
.social__intro .section-label { margin-bottom:55px; }
.social__intro p { max-width:390px; margin:45px 0 28px; color:var(--muted); line-height:1.8; }
.text-link { display:inline-block; border-bottom:1px solid #fff; padding-bottom:7px; font-size:10px; letter-spacing:.2em; }
.social-grid { display:grid; grid-template-columns:1fr 1fr; gap:14px; align-items:start; }
.social-card { position:relative; overflow:hidden; background:#111; min-height:360px; aspect-ratio:1.36/1; }
.social-card:nth-child(2), .social-card:nth-child(4) { margin-top:70px; }
.social-card--wide { min-height:0; }
.social-card img { width:100%; height:100%; object-fit:cover; filter:grayscale(1) contrast(1.04) brightness(.86); transition:transform .8s var(--ease),filter .55s var(--ease); }
.social-card:hover img { transform:scale(1.045); filter:grayscale(0) contrast(1) brightness(.82); }
.social-card::after { content:"↗"; position:absolute; top:16px; right:16px; width:38px; height:38px; border:1px solid rgba(255,255,255,.62); border-radius:50%; display:grid; place-items:center; opacity:0; transform:translateY(7px); transition:.35s; }
.social-card:hover::after { opacity:1; transform:none; }

.closing { min-height:100svh; padding:110px var(--pad) 70px; background:#f2f1ed; color:#08090b; display:flex; flex-direction:column; justify-content:center; }
.closing__eyebrow { font-size:10px; letter-spacing:.28em; margin-bottom:70px; }
.closing__brand { margin:0; font:400 clamp(95px,20vw,320px)/.75 "Space Grotesk",sans-serif; letter-spacing:-.085em; text-transform:lowercase; }
.closing__motto { margin:42px 0 75px; font-size:12px; letter-spacing:.5em; }
.closing__contact { display:grid; grid-template-columns:1fr 1fr; border-top:1px solid rgba(8,9,11,.18); border-bottom:1px solid rgba(8,9,11,.18); }
.closing__contact a { padding:28px 0; display:flex; flex-direction:column; gap:12px; }
.closing__contact a + a { border-left:1px solid rgba(8,9,11,.18); padding-left:35px; }
.closing__contact small { font-size:9px; letter-spacing:.2em; color:#5b5e63; }
.closing__contact span { font:400 clamp(20px,2.3vw,34px)/1.25 "Space Grotesk",sans-serif; }
.closing__links { display:flex; flex-wrap:wrap; gap:28px; margin-top:35px; font-size:11px; letter-spacing:.16em; }
footer { display:flex; justify-content:space-between; padding:28px var(--pad); font-size:9px; letter-spacing:.17em; color:#9ca0a7; }

.reveal { opacity:0; transform:translateY(34px); transition:opacity 1s ease,transform 1s var(--ease); }
.reveal--delay { transition-delay:.12s; }
.reveal.is-visible { opacity:1; transform:none; }

@media (max-width: 900px) {
  .desktop-nav { display:none; }
  .menu-button { display:grid; }
  .story-grid,.manifesto,.social { grid-template-columns:1fr; }
  .culture__content { width:100%; margin-left:0; padding-left:0; background:none; }
  .story-copy { margin-top:45px; }
  .manifesto__copy { margin-top:50px; }
  .social__intro { position:static; }
  .social-grid { margin-top:55px; }
  .closing__contact { grid-template-columns:1fr; }
  .closing__contact a + a { border-left:0; border-top:1px solid rgba(8,9,11,.18); padding-left:0; }
}

@media (max-width: 700px) {
  .hero__image { inset:0; width:100%; background-position:51% center; }
  .hero__shade { background:linear-gradient(0deg,rgba(5,6,8,.90),rgba(5,6,8,.10) 72%); }
  .hero { align-items:flex-end; }
  .hero__content { justify-content:flex-start; padding-bottom:110px; }
  .hero h1 { width:100%; font-size:clamp(62px,19vw,108px); }
  .image-statement { min-height:82svh; }
  .image-statement__image { background-position:58% center; }
  .modality { grid-template-columns:42px 1fr 24px; padding:24px 0; }
  .modality p { grid-column:2; margin:12px 0 0; }
  .modality b { grid-column:3; grid-row:1 / span 2; }
  .metrics { grid-template-columns:1fr 1fr; }
  .metric:nth-child(2) { border-right:0; }
  .metric:nth-child(-n+2) { border-bottom:1px solid var(--line); }
  .social-grid { grid-template-columns:1fr; }
  .social-card:nth-child(2), .social-card:nth-child(4) { margin-top:0; }
  .social-card,.social-card--wide { min-height:0; aspect-ratio:4/3; }
  .culture { min-height:82svh; }
  .culture__word { top:30%; font-size:28vw; }
  .culture__content p { margin-left:0; }
  footer { flex-direction:column; gap:12px; }
}

@media (prefers-reduced-motion: reduce) {
  *,*::before,*::after { animation-duration:.01ms !important; animation-iteration-count:1 !important; scroll-behavior:auto !important; transition-duration:.01ms !important; }
  .intro { display:none; }
  .reveal { opacity:1; transform:none; }
  .hero-line > span { transform:none; }
}

/* Final refinements: vector modality arrows and fully legible PERTENCIMENTO. */
.modality__arrow {
  width: 30px;
  height: 30px;
  display: grid;
  place-items: center;
  color: var(--text);
}
.modality__arrow svg {
  width: 23px;
  height: 23px;
  display: block;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.35;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.modality:hover .modality__arrow { color: #08090b; }

.culture__word {
  left: 50%;
  top: 48%;
  width: calc(100% - (2 * var(--pad)));
  transform: translate(-50%, -50%);
  text-align: center;
  font-size: clamp(70px, 9.2vw, 158px);
  line-height: .9;
  letter-spacing: -.065em;
  -webkit-text-stroke: 1px rgba(255,255,255,.10);
  opacity: .72;
}

@media (max-width: 700px) {
  .modality__arrow {
    width: 28px;
    height: 28px;
  }
  .modality__arrow svg {
    width: 21px;
    height: 21px;
  }
  .culture__word {
    top: 23%;
    width: calc(100% - 36px);
    font-size: clamp(34px, 10.4vw, 48px);
    line-height: 1;
    letter-spacing: -.055em;
    -webkit-text-stroke-color: rgba(255,255,255,.11);
    opacity: .7;
  }
}
