/* Layout: Studio Ayl dark homepage extended into one scrolling page; sections alternate
   rich black / trusty blue with cloud blue and warm grey bands, hairline teal rules, stipple imagery. */
@font-face{font-family:"Marjorie";src:url("fonts/Marjorie-Regular.woff2") format("woff2");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:"Marjorie";src:url("fonts/Marjorie-Italic.woff2") format("woff2");font-weight:400;font-style:italic;font-display:swap}
@font-face{font-family:"Svatopluk";src:url("fonts/Svatopluk-Regular.woff2") format("woff2");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:"Svatopluk";src:url("fonts/Svatopluk-Medium.woff2") format("woff2");font-weight:500;font-style:normal;font-display:swap}
:root{
  /* Brand palette (TTV brand book p. 26) */
  --rich-black:#010B13; --trusty-blue:#1A3C4A; --trusty-teal:#5EA2B0; --science-green:#1B4D4F;
  --warm-grey:#E5E1E0; --cloud-blue:#BCCED2; --natural-green:#9DD395; --lichen:#B8D44A;
  --rule-dark:rgba(94,162,176,.55); --rule-light:rgba(26,60,74,.35);
  --muted-dark:rgba(229,225,224,.78); --muted-light:rgba(1,11,19,.74);
  /* Type (brand book pp. 28–30) */
  --f-display:"Marjorie",Georgia,"Times New Roman",serif;
  --f-body:"Svatopluk","Helvetica Neue",Arial,sans-serif;
  --t-h1:clamp(2.5rem,1.3rem + 4.2vw,4rem);
  --t-h2:clamp(2rem,1.25rem + 2.6vw,3rem);
  --t-h3:clamp(1.5rem,1.2rem + 1vw,2rem);
  --t-big:clamp(1.125rem,1rem + .45vw,1.3125rem);
  --t-body:1.0625rem; --t-small:.9375rem; --t-eyebrow:.8125rem;
  --gutter:clamp(16px,4vw,48px); --maxw:1200px;
  color-scheme:dark;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important;animation:none!important}}
body{margin:0;background:var(--rich-black);color:var(--warm-grey);font-family:var(--f-body);font-size:var(--t-body);line-height:1.55;-webkit-font-smoothing:antialiased}
img{max-width:100%;display:block}
a{color:inherit}
:focus-visible{outline:2px solid var(--lichen);outline-offset:3px}
.wrap{max-width:var(--maxw);margin-inline:auto;padding-inline:var(--gutter)}
.eyebrow{font-weight:500;font-size:var(--t-eyebrow);letter-spacing:.09em;text-transform:uppercase;margin:0}
h1,h2,h3{font-weight:400;margin:0;text-wrap:balance}
h1,h2{font-family:var(--f-display)}
h1{font-size:var(--t-h1);line-height:1.02;letter-spacing:-.01em}
h2{font-size:var(--t-h2);line-height:1.06;letter-spacing:-.005em}
em{font-family:var(--f-display);font-style:italic}
p{margin:0}
.big{font-size:var(--t-big);line-height:1.5}
.arrow-link{display:inline-flex;gap:.5em;align-items:baseline;text-decoration:none;font-weight:500;border-bottom:1px solid currentColor;padding-bottom:2px}
.arrow-link:hover{border-bottom-color:transparent}
section{position:relative;overflow:hidden}
.sec{padding-block:clamp(72px,10vw,128px)}
.sec-head{display:grid;gap:20px;max-width:780px}

/* Dark / light section skins */
.dark{background:var(--rich-black);color:var(--warm-grey)}
.dark .eyebrow{color:var(--trusty-teal)}
.dark em{color:var(--lichen)}
.blue{background:var(--trusty-blue);color:var(--warm-grey)}
.blue .eyebrow{color:var(--lichen)}
.light{color:var(--rich-black)}
.light .eyebrow{color:var(--trusty-blue)}
.light em{color:var(--science-green)}
.cloud{background:var(--cloud-blue)}
.grey{background:var(--warm-grey)}

/* Header */
.site-header{position:sticky;top:env(safe-area-inset-top,0px);z-index:20;background:rgba(1,11,19,.86);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border-bottom:1px solid rgba(94,162,176,.25)}
.site-header .wrap{display:flex;align-items:center;justify-content:space-between;gap:24px;min-height:76px}
.logo img{height:44px;width:auto}
.nav{display:flex;align-items:center;gap:clamp(18px,2.4vw,34px)}
.nav ul{display:flex;gap:clamp(18px,2.4vw,34px);list-style:none;margin:0;padding:0}
.nav ul a{text-decoration:none;font-size:var(--t-eyebrow);font-weight:500;letter-spacing:.09em;text-transform:uppercase;padding-block:6px;border-bottom:1px solid transparent}
.nav ul a:hover{border-bottom-color:var(--trusty-teal)}
.btn{display:inline-flex;align-items:center;gap:.5em;font:500 .9375rem/1 var(--f-body);text-decoration:none;border-radius:2px;padding:.85em 1.15em;cursor:pointer}
.btn-outline{border:1px solid var(--lichen);color:var(--lichen);background:transparent}
.btn-outline:hover{background:var(--lichen);color:var(--rich-black)}
.btn-solid{background:var(--lichen);color:var(--rich-black);border:1px solid var(--lichen)}
.btn-solid:hover{background:transparent;color:var(--lichen)}
.menu-btn{display:none;background:none;border:1px solid var(--rule-dark);color:var(--warm-grey);font:500 var(--t-eyebrow)/1 var(--f-body);letter-spacing:.09em;text-transform:uppercase;padding:.8em 1em;border-radius:2px;cursor:pointer}
@media (max-width:860px){
  .menu-btn{display:inline-block}
  .nav ul{display:none;position:absolute;left:0;right:0;top:100%;flex-direction:column;gap:0;background:var(--rich-black);border-bottom:1px solid var(--rule-dark);padding:8px var(--gutter) 16px}
  .nav ul.open{display:flex}
  .nav ul a{display:block;padding-block:14px;border-bottom:1px solid rgba(94,162,176,.2)}
  .nav .btn{display:none}
  .logo img{height:36px}
}

/* Hero */
.hero{background:linear-gradient(165deg,var(--rich-black) 0%,var(--rich-black) 25%,var(--trusty-blue) 100%)}
.hero-img{position:absolute;inset:0 -6% 0 auto;width:68%;height:100%;object-fit:cover;object-position:35% 65%;mix-blend-mode:screen;opacity:.95;pointer-events:none}
.hero .wrap{position:relative;padding-block:clamp(72px,11vw,150px) clamp(64px,9vw,120px);display:grid;gap:28px}
.hero h1{max-width:13ch}
.hero .lede{max-width:34ch;color:var(--warm-grey)}
.link-list{list-style:none;margin:12px 0 0;padding:0;max-width:440px}
.link-list li{border-top:1px solid var(--rule-dark)}
.link-list li:last-child{border-bottom:1px solid var(--rule-dark)}
.link-list a{display:flex;justify-content:space-between;gap:16px;padding:16px 2px;text-decoration:none;font-weight:500}
.link-list a span{transition:transform .2s}
.link-list a:hover span{transform:translateX(4px)}
@media (max-width:700px){.hero-img{width:120%;inset:auto -45% 0 auto;height:70%;opacity:.55}}

/* Why now */
.why-img{position:absolute;right:-8%;top:50%;transform:translateY(-50%);width:min(620px,60%);mix-blend-mode:multiply;opacity:.16;pointer-events:none}
.points{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:40px 56px;margin-top:56px;max-width:980px;position:relative}
.point{border-top:1px solid var(--rule-light);padding-top:20px;display:grid;gap:10px;min-width:0}
.point h3{font:500 1.1875rem/1.3 var(--f-body)}
.point h3 sup{font-size:.7em;color:var(--science-green);margin-right:.5em;vertical-align:.5em}
.point p{color:var(--muted-light)}
@media (max-width:700px){.points{grid-template-columns:minmax(0,1fr);gap:32px}}

/* Trust tech stack */
.stack-img{position:absolute;right:0;top:0;width:min(900px,80%);mix-blend-mode:screen;opacity:.35;pointer-events:none}
.stack-list{list-style:none;margin:56px 0 0;padding:0;position:relative}
.stack-list li{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:12px 48px;align-items:baseline;padding-block:22px;border-top:1px solid var(--rule-dark)}
.stack-list li:last-child{border-bottom:1px solid var(--rule-dark)}
.stack-name{font-family:var(--f-display);font-size:clamp(1.875rem,1.2rem + 2.4vw,3.25rem);line-height:1.05}
.stack-name sup{font-family:var(--f-body);font-size:.95rem;font-weight:500;color:var(--trusty-teal);vertical-align:1.6em;margin-left:.15em;letter-spacing:.02em}
.stack-def{color:var(--muted-dark);font-size:var(--t-big);max-width:36ch}
.stack-foot{margin-top:40px;display:flex;flex-wrap:wrap;gap:24px;align-items:center;justify-content:space-between;position:relative}
.stack-foot{justify-content:flex-start;gap:16px 40px}
.stack-foot .arrow-link{color:var(--lichen)}
.stack-foot .arrow-link.quiet{color:var(--warm-grey)}
.stack-foot small{color:var(--muted-dark);font-size:var(--t-small)}
@media (max-width:700px){.stack-list li{grid-template-columns:minmax(0,1fr);gap:6px}.stack-img{opacity:.16}}

/* Approach */
.approach-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:40px;margin-top:56px}
.approach-grid div{border-top:1px solid var(--rule-light);padding-top:20px;display:grid;gap:12px;align-content:start;min-width:0}
.approach-grid p{color:var(--muted-light)}
@media (max-width:860px){.approach-grid{grid-template-columns:minmax(0,1fr);gap:32px}}

/* Team */
.team-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(32px,5vw,72px);margin-top:56px}
.person{display:grid;gap:18px;align-content:start;min-width:0}
.person figure{margin:0;aspect-ratio:4/5;max-width:100%;overflow:hidden;background:var(--rich-black)}
.person img{width:100%;height:100%;object-fit:cover}
.person h3{font-family:var(--f-display);font-size:var(--t-h3);line-height:1.1}
.person .role{color:var(--lichen)}
.person p.bio{color:var(--muted-dark)}
.person .arrow-link{color:var(--trusty-teal);justify-self:start}
.team-intro{color:var(--muted-dark);max-width:52ch}
@media (max-width:700px){.team-grid{grid-template-columns:minmax(0,1fr)}}

/* Insights */
.feature{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:0;margin-top:56px;border-top:1px solid var(--rule-light);border-bottom:1px solid var(--rule-light)}
.feature-art{background:var(--science-green);position:relative;min-height:280px;overflow:hidden}
.feature-art img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:70% 60%;mix-blend-mode:screen}
.feature-body{padding:clamp(28px,4vw,56px);display:grid;gap:18px;align-content:center;min-width:0}
.feature-body h3{font-family:var(--f-display);font-size:clamp(1.75rem,1.2rem + 1.8vw,2.625rem);line-height:1.08}
.feature-body p{color:var(--muted-light);max-width:52ch}
.feature-body .arrow-link{justify-self:start;color:var(--trusty-blue)}
.subscribe{margin-top:28px}
.subscribe .arrow-link{color:var(--trusty-blue)}
@media (max-width:760px){.feature{grid-template-columns:minmax(0,1fr)}.feature-art{min-height:200px}}

/* Contact */
.contact{background:linear-gradient(195deg,var(--rich-black) 10%,var(--trusty-blue) 100%)}
.contact-img{position:absolute;left:50%;bottom:-30%;transform:translateX(-50%);width:min(1300px,140%);mix-blend-mode:screen;opacity:.32;pointer-events:none}
.contact .wrap{position:relative}
.contact h2{max-width:18ch}
.routes{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:40px 56px;margin-top:56px;max-width:980px}
.route{border-top:1px solid var(--rule-dark);padding-top:20px;display:grid;gap:16px;align-content:start;min-width:0}
.route p{color:var(--muted-dark)}
.route .btn{justify-self:start}
.route .note{font-size:var(--t-small);color:var(--muted-dark)}
.email{font-family:var(--f-display);font-size:clamp(1.375rem,1.1rem + 1vw,1.875rem);color:var(--warm-grey);text-decoration:none;border-bottom:1px solid var(--trusty-teal);justify-self:start;overflow-wrap:anywhere}
.places{margin-top:56px;color:var(--muted-dark);font-size:var(--t-small);letter-spacing:.04em}
.places a{text-decoration:none;display:inline-block;padding-block:12px;background:linear-gradient(var(--trusty-teal),var(--trusty-teal)) bottom 10px left/100% 1px no-repeat}
@media (max-width:700px){.routes{grid-template-columns:minmax(0,1fr)}}

/* Footer */
.site-footer{background:var(--rich-black);border-top:1px solid rgba(94,162,176,.25);padding-block:48px 40px;font-size:var(--t-small);color:var(--muted-dark)}
.site-footer .wrap{display:grid;gap:28px}
.foot-top{display:flex;flex-wrap:wrap;gap:24px;justify-content:space-between;align-items:center}
.foot-top img{height:36px;width:auto}
.foot-links{display:flex;flex-wrap:wrap;gap:8px 28px;list-style:none;margin:0;padding:0}
.foot-links a{text-decoration:none;display:inline-block;padding-block:12px;border-bottom:1px solid transparent}
.foot-links a:hover{border-bottom-color:var(--trusty-teal)}
.foot-legal{display:grid;gap:6px;max-width:70ch}


/* Legal pages */
.legal-page{background:var(--warm-grey);color:var(--rich-black)}
.legal-page .wrap{padding-block:clamp(56px,8vw,104px)}
.legal{max-width:68ch;display:grid;gap:18px}
.legal .eyebrow{color:var(--trusty-blue)}
.legal h1{font-size:clamp(2.25rem,1.4rem + 3vw,3.25rem);line-height:1.05}
.legal .meta{display:flex;flex-wrap:wrap;gap:8px 24px;font-size:var(--t-small);color:var(--muted-light);padding-bottom:12px;border-bottom:1px solid var(--rule-light)}
.legal .meta a{color:var(--trusty-blue);display:inline-block;padding-block:10px;margin-block:-10px}
.legal h2{font:500 1.1875rem/1.3 var(--f-body);margin-top:22px}
.legal p,.legal address{color:var(--muted-light);font-style:normal}
.legal address{display:grid;gap:4px;padding:18px 20px;border-left:2px solid var(--trusty-teal);background:rgba(188,206,210,.35)}
.legal address strong{color:var(--rich-black);font-weight:500}
.legal a{color:var(--trusty-blue);overflow-wrap:anywhere}
.note a{color:inherit}