/* HOSTION — quiet architecture. Video is the only continuous visual movement.
   Content, original brand tokens and font families are retained. */
html { scroll-padding-top:120px; }
header {
  position:fixed; z-index:20; top:18px; left:50%;
  width:min(1320px,calc(100% - 48px)); transform:translateX(-50%);
  background:#121513; border:1px solid rgba(224,189,120,.2);
  border-radius:12px; box-shadow:0 10px 30px rgba(0,0,0,.14);
}
@supports ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))) {
  header { background:rgba(12,16,13,.91); -webkit-backdrop-filter:blur(14px); backdrop-filter:blur(14px); }
}
header nav.shell { width:100%; height:82px; padding:0 24px; }
header .brand img { width:56px; height:56px; }
.nav-links { gap:clamp(16px,2vw,29px); }
.nav-links>a:not(.button) { padding:16px 0; }
.nav-links>a:not(.button):hover { color:var(--gold-light); }
header .button { min-height:46px; border-radius:5px; }
.mobile-nav summary { width:44px; min-height:44px; display:grid; place-items:center; }
.mobile-panel { top:58px; max-width:calc(100vw - 48px); max-height:calc(100svh - 130px); overflow-y:auto; background:var(--black); border-radius:10px; box-shadow:0 15px 35px rgba(0,0,0,.18); }
a:focus-visible,button:focus-visible,summary:focus-visible { outline:2px solid var(--gold); outline-offset:5px; }
.hero,.hero-content { min-height:clamp(780px,100svh,1020px); }
.hero-content { padding-top:180px; padding-bottom:235px; }
.hero-proof { bottom:0; background:rgba(11,13,12,.86); -webkit-backdrop-filter:none; backdrop-filter:none; border-top:1px solid rgba(255,255,255,.18); }
.proof-grid { gap:0; }
.proof { min-height:122px; padding:25px 28px; }
.proof span { color:rgba(255,255,255,.84); }
.hero-tools { bottom:145px; }
.video-toggle { border-radius:5px; background:rgba(11,13,12,.8); }
.button { border-radius:5px; transition:background-color .2s ease,color .2s ease,border-color .2s ease; }
.hero-actions .button.outline { background:rgba(11,13,12,.25); }
.hero-actions .button.outline:hover { background:var(--white); }
.audiences { background:var(--black); }
.audience-grid { gap:28px; border:0; }
.audience-card,.audience-card:last-child { border:1px solid rgba(224,189,120,.22); border-radius:10px; background:var(--black-2); }
.audience-card p { color:rgba(255,255,255,.78); }
.audience-card { transition:border-color .2s ease; }
.audience-card:focus-within { border-color:var(--gold); }
.journey { grid-template-columns:repeat(3,minmax(0,1fr)); gap:50px 36px; }
.journey li { padding:32px 16px 0 0; border-top-color:rgba(153,110,40,.45); }
.journey h3 { font-size:21px; }
.journey p { font-size:16px; }
.portfolio-card { background:var(--white); border:1px solid var(--line); border-radius:10px; overflow:hidden; transition:border-color .2s ease,box-shadow .25s ease; }
.portfolio-body { background:var(--white); }
.portfolio-body p { color:#50564e; }
.portfolio-visual .status { border-radius:4px; }
.portfolio-card:focus-within { border-color:var(--gold); }
.contact-card { background:var(--white); border-radius:10px; box-shadow:0 10px 28px rgba(30,34,27,.04); }
.contact-form input,.contact-form select,.contact-form textarea { border-radius:5px; }
.contact-form input:focus-visible,.contact-form select:focus-visible,.contact-form textarea:focus-visible { outline:2px solid #946a28; outline-offset:2px; }
.contact-card p,.contact-card .consent { color:#50564e; }
@media(hover:hover) and (pointer:fine) {
  .portfolio-card:hover { border-color:rgba(153,110,40,.48); box-shadow:0 10px 28px rgba(35,31,23,.08); }
  .audience-card:hover { border-color:rgba(224,189,120,.48); }
}
@media(max-width:1100px) {
  header .nav-links { display:none; }
  header .mobile-nav { display:block; }
}
@media(max-width:1050px) {
  .hero-content { padding-bottom:335px; }
  .hero-tools { bottom:245px; }
  .proof { min-height:110px; padding:20px 24px; }
  .journey { grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@media(max-width:700px) {
  html { scroll-padding-top:104px; }
  header { top:12px; width:calc(100% - 24px); border-radius:10px; }
  header nav.shell { height:72px; padding:0 14px; }
  header .brand { gap:9px; }
  header .brand img { width:46px; height:46px; }
  .mobile-panel { top:56px; }
  .hero,.hero-content { min-height:950px; }
  .hero-content { padding-top:133px; padding-bottom:330px; }
  .hero-tools { bottom:244px; }
  .proof { min-height:110px; padding:18px 14px; }
  .audience-grid { gap:18px; }
  .journey { grid-template-columns:1fr; gap:0; }
  .journey li { padding:0 0 34px 39px; }
}
@media(prefers-reduced-motion:reduce) {
  html { scroll-behavior:auto; }
  *,*::before,*::after { transition:none!important; }
}
@media(prefers-reduced-transparency:reduce) {
  header,.hero-proof { background:var(--black); -webkit-backdrop-filter:none; backdrop-filter:none; }
}
@media(forced-colors:active) {
  header,.hero-proof,.audience-card,.portfolio-card,.contact-card { background:Canvas; color:CanvasText; border-color:CanvasText; box-shadow:none; -webkit-backdrop-filter:none; backdrop-filter:none; }
}
