/* Setpoint: the parts bank pieces, knobs set to this site's tokens. Loaded after the parts' own CSS. */

/* Wordmark, set as type: an S with a degree mark in the dial's accent */
.brand .mark{width:44px;height:44px;flex:none;border-radius:.7rem;
  background:#0e1733;border:1px solid rgba(255,255,255,.16);
  font-family:"Barlow Condensed";font-weight:800;font-size:1.9rem;line-height:1;color:#fff;
  box-shadow:inset 0 -3px 0 var(--accent);transition:box-shadow .3s ease}
.brand .mark{display:flex;align-items:flex-start;justify-content:center;padding-top:.32rem}
.brand .mark i{font-style:normal;font-size:.62em;color:var(--accent);margin-left:.02em;transition:color .3s ease}
@media(max-width:560px){.brand .mark{width:38px;height:38px;font-size:1.6rem}}

/* Gallery without the old photos: one feature beside a stack of two */
.gallery--three{grid-template-columns:2fr 1fr}
.gallery--three>.shot{grid-column:auto;grid-row:auto;aspect-ratio:auto;min-height:100%}
.gallery__stack{display:grid;gap:.9rem}
.gallery__stack .shot{grid-column:auto;grid-row:auto;aspect-ratio:1}
@media(max-width:980px){
  .gallery--three{grid-template-columns:1fr}
  .gallery--three>.shot{aspect-ratio:16/10;min-height:0}
  .gallery__stack{grid-template-columns:1fr 1fr}
}

/* staged-hero-load: no preloader here, so the sheet starts at once; the dial lands from a gentle zoom */
.hero{--stage-zoom:1.18}

/* double-text-hover: nav links roll, the dot takes the dial's accent */
.nav-links .dt{--dt-dot-color:var(--accent)}
.nav-links .dt:hover{color:var(--accent)}

/* bubble-rise-button: the primary buttons fill with a white bubble rising out of their bottom edge */
.btn.brb{
  --brb-bg:var(--accent);--brb-ink:#0a1020;--brb-fill:#fff;--brb-ink-on:#0a1020;
  --brb-pad:.85rem 1.5rem;--brb-radius:.6rem;--brb-text:1.02rem;
  font-family:"Barlow Condensed",system-ui,sans-serif;font-weight:700;letter-spacing:.04em;gap:.55rem;
  justify-content:flex-start;
}
.btn.brb:hover{transform:none}
.nav-cta .btn-primary.brb,.hero-cta .btn.brb{justify-content:center}
@media(max-width:560px){.hero-cta .btn.brb{--brb-pad:.78rem 1.05rem;font-size:.95rem}}

/* sticky-cta-pill: the 24/7 call, on the site's ink with the accent chip */
.scta{
  --scta-bg:#0f1830;--scta-ink:#f6f3ec;--scta-ring:color-mix(in oklab,var(--accent),transparent 45%);
  --scta-font:"Barlow Condensed",system-ui,sans-serif;
  font-size:1rem;letter-spacing:.06em;text-transform:uppercase;
}
.scta__chip{background:var(--accent);color:#0a1020}
.scta__icon.svg-ic{width:16px;height:16px;stroke-width:2.2}

/* the scroll thermometer and the pill share the right edge: keep the thermometer above it */
@media(max-height:700px){.thermo{top:42%}}

/* craft fixes */
/* the old CARTO dark tiles now answer "API key required": plain OpenStreetMap tiles, darkened to the site's night */
.night-tiles{filter:invert(1) hue-rotate(195deg) brightness(.82) contrast(.92) saturate(.6)}
/* the services bento left two empty cells on its last row: three halves fill it */
@media(min-width:981px){
  .bento .t-sm,.bento .tile.cta-tile{grid-column:span 3}
}
/* the empty easter-egg toast peeked above the bottom edge at rest: park it fully off screen */
.toast{translate:-50% calc(100% + 60px)}
.toast.show{translate:-50% 0}
/* the closing headline wrapped to three lines under a 16ch cap; two read better */
.final h2{max-width:22ch}
.final h2{max-width:none;text-wrap:balance;font-size:clamp(2.6rem,5.2vw,4.4rem)}
/* the dial held a small ring in a big right half on wide screens */
@media(min-width:1500px){.dial{width:min(30vw,470px)}}
/* the hero photo was a ::before; as a real layer it reads as the backdrop it is (same paint, same place) */
.hero::before{content:none}
.hero>.hero-photo{position:absolute;inset:0;z-index:0;
  background:
    radial-gradient(70% 60% at 86% 16%, color-mix(in oklab,var(--accent-deep),transparent 80%), transparent 60%),
    linear-gradient(105deg,#090e1c 0%, rgba(9,14,28,.93) 30%, rgba(9,14,28,.55) 56%, rgba(9,14,28,.20) 100%),
    linear-gradient(0deg, rgba(7,11,22,.88) 0%, rgba(7,11,22,.12) 42%),
    url('assets/hero-bg.jpg');
  background-size:cover;background-position:center right;background-repeat:no-repeat}
/* the why photo inherited the gallery feature's 16/10 on tablets and phones and left a band empty under it */
.why .photo .shot{aspect-ratio:auto!important;grid-column:auto;grid-row:auto}
