/* Typography in motion, on a warm mineral surface.
   This sheet owns the contact ground tokens (mineral and harbour). The hidden WebGL layer and side rails,
   and the Night Periwinkle accent in dark mode, come from the branch block at the top of styles.css. */
html[data-branch="contact"]{--porcelain:#f2eee5;--paper:#faf7f0;--ink:#252d35;--ink-soft:#495057;--muted:#636960;--line:rgba(37,45,53,.12);--line-strong:rgba(37,45,53,.22);--accent:#254565;--accent-soft:#476787;--accent-rgb:37,69,101;color-scheme:light}
html[data-branch="contact"] .grain{opacity:.025;mix-blend-mode:multiply}
html[data-branch="contact"] .nav{background:rgba(242,238,229,.94);color:#252d35}
html[data-branch="contact"] .nav.scrolled{background:rgba(242,238,229,.96)}
html[data-branch="contact"] .nav .brand-mark{filter:none}
html[data-branch="contact"] .nav .btn-dark{background:#182638;color:#f7f8fb}
.ct-page{position:relative;isolation:isolate;min-height:950px;background:#f2eee5;padding-top:112px;overflow:clip}
.ct-page::before{content:'';position:absolute;inset:0;pointer-events:none;z-index:-1;background:linear-gradient(90deg,rgba(255,255,255,.22),transparent 60%)}
.ct-wrap{max-width:1240px;padding:0 40px;margin:auto}
.ct-direct{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:28px 0 42px;color:var(--ink-soft);font-size:14px}
.ct-direct a{font-size:21px;color:var(--ink);border-bottom:1px solid var(--accent);padding:8px 0;overflow-wrap:anywhere;transition:color .25s}
.ct-direct a:hover{color:var(--accent)}
.ct-direct a span{margin-left:17px;color:var(--accent)}
.ct-overline{display:flex;justify-content:space-between;gap:16px;border-top:1px solid var(--line-strong);padding:24px 0 0;font:11px/1.6 'JetBrains Mono',monospace;letter-spacing:.07em;color:var(--accent)}
.ct-overline>span:last-child{color:var(--muted);white-space:nowrap}
.ct-history{min-height:73px;display:flex;align-items:center;gap:22px;font-size:13px;color:var(--ink-soft)}
.ct-page button{font-family:inherit;cursor:pointer}
.ct-history button{min-height:44px;border:0;background:none;color:var(--ink);font-size:14px;padding:10px 0}
.ct-stage{display:grid;grid-template-columns:1.05fr 1fr;gap:clamp(30px,5vw,74px);min-height:525px;padding-bottom:54px}
.ct-heading{position:relative}
.ct-heading h1{font-size:clamp(57px,6.2vw,86px);font-weight:400;line-height:1.03;letter-spacing:-.055em;scroll-margin-top:110px}
.ct-heading h1 em{font-weight:400;color:var(--accent)}
.ct-heading h1:focus,.ct-success h2:focus{outline:none}
.ct-heading>p{font-size:16px;line-height:1.8;color:var(--ink-soft);margin-top:28px;max-width:34ch}
.ct-numeral{display:block;color:#243f77;opacity:.1;font-size:190px;line-height:.9;letter-spacing:-.075em;margin-top:45px;user-select:none}
.ct-options>button{display:grid;grid-template-columns:24px minmax(0,1fr) 25px;align-items:center;gap:18px;width:100%;min-height:110px;padding:26px 0;background:transparent;color:var(--ink);border:0;border-top:1px solid var(--line-strong);text-align:left;position:relative}
.ct-options>button:last-child{border-bottom:1px solid var(--line-strong)}
.ct-options>button::before{content:'';position:absolute;top:-1px;left:0;width:0;height:2px;background:var(--accent);transition:width .4s var(--ease)}
.ct-options>button>span:first-child{font:11px 'JetBrains Mono',monospace;color:var(--accent)}
.ct-options strong{font-size:clamp(26px,2.4vw,34px);line-height:1.2;font-weight:400;letter-spacing:-.035em;transition:transform .3s,color .3s}
.ct-options>button>span:last-child{font-size:26px;color:var(--accent);transition:transform .3s}
.ct-options>button:hover::before{width:100%}
.ct-options>button:hover strong{transform:translateX(5px);color:var(--accent)}
.ct-options>button:hover>span:last-child{transform:translate(3px,-3px)}
.ct-page :is(a,button,input,textarea):focus-visible{outline:2px solid var(--accent);outline-offset:5px}
.ct-page [hidden]{display:none!important}
.ct-page fieldset{border:0;min-width:0}
.ct-page form label{display:block;font-size:13px;color:var(--ink-soft);margin-bottom:5px}
.ct-page form input:not([name="website"]),.ct-page form textarea{font:400 23px/1.5 'Hanken Grotesk',sans-serif;background:transparent;color:var(--ink);display:block;width:100%;min-width:0;border:0;border-bottom:1px solid var(--line-strong);border-radius:0;box-shadow:none;padding:10px 0 13px;margin-bottom:27px}
.ct-page form input::placeholder,.ct-page form textarea::placeholder{color:#5c6a7d;opacity:1}
.ct-page form textarea{font-size:17px;resize:vertical;min-height:85px;margin-bottom:23px}
.ct-note-label small{display:block;font-size:11px;margin-top:3px;color:var(--muted)}
.ct-summary{position:relative;padding-right:68px;margin:24px 0;color:var(--ink-soft)}
.ct-summary>span{font:10px/1.5 'JetBrains Mono',monospace;color:var(--accent);letter-spacing:.05em}
.ct-summary p{font-size:13px;line-height:1.6;margin:6px 0 0}
.ct-summary button{position:absolute;right:0;top:0;border:0;background:none;color:var(--ink);text-decoration:underline;font-size:12px;min-height:44px}
.ct-send{display:flex;align-items:center;justify-content:space-between;gap:16px;width:100%;padding:18px 23px;border:0;background:#254565;color:#fff;min-height:63px;font-size:18px;transition:background .25s}
.ct-send:hover{background:#18334d}
.ct-send>span:last-child{font-size:28px;line-height:1}
.ct-page fieldset:disabled{opacity:.65}
.ct-page fieldset:disabled button{cursor:wait}
.ct-privacy{font-size:12px;line-height:1.65;color:var(--muted);margin-top:17px}
.ct-privacy a{text-decoration:underline;text-underline-offset:3px}
.ct-error{margin-top:18px;color:#932c25;font-size:14px;line-height:1.6}
.ct-trap{position:absolute;left:-10000px;width:1px;height:1px;overflow:hidden}
.ct-sr{position:absolute;width:1px;height:1px;clip-path:inset(50%);overflow:hidden;white-space:nowrap}
.ct-success{padding:16px 0}
.ct-success-mark{font-size:64px;color:var(--accent)}
.ct-success h2{font-weight:400;font-size:48px;line-height:1.1;letter-spacing:-.045em;margin:20px 0}
.ct-success p{font-size:17px;line-height:1.8;color:var(--ink-soft);max-width:36ch}
.ct-success a{display:inline-block;margin-top:35px;padding:12px 0;color:var(--accent);border-bottom:1px solid currentColor}
.ct-foot{display:flex;justify-content:space-between;gap:25px;border-top:1px solid var(--line-strong);padding:24px 0 33px;color:var(--ink-soft);font-size:12px}
.ct-foot>span:first-child{font:10px/1.7 'JetBrains Mono',monospace;letter-spacing:.05em}
@media(max-width:760px){
 .ct-page{padding-top:88px;min-height:0}
 .ct-wrap{padding:0 24px}.ct-direct{align-items:flex-start;flex-direction:column;gap:5px;padding:25px 0 30px;font-size:13px}.ct-direct a{font-size:19px}
 .ct-overline{font-size:10px;padding-top:21px}.ct-overline>span:first-child{max-width:28ch}
 .ct-history{min-height:60px;gap:15px;font-size:12px}.ct-stage{grid-template-columns:1fr;gap:32px;min-height:640px;padding-bottom:45px}
 .ct-heading h1{font-size:clamp(47px,9vw,66px);line-height:1.06}.ct-heading>p{font-size:15px;margin-top:20px}.ct-numeral{display:none}
 .ct-options>button{min-height:91px;padding:22px 0;grid-template-columns:20px minmax(0,1fr) 22px;gap:12px}.ct-options strong{font-size:27px}
 .ct-foot{align-items:flex-start;flex-direction:column;gap:10px}.ct-success h2{font-size:42px}
}
@media(prefers-reduced-motion:reduce){.ct-page *,.ct-page *::before{transition:none!important;animation:none!important}.ct-options>button:hover strong,.ct-options>button:hover>span:last-child{transform:none}}
/* Night: the site's dark set and periwinkle accent; a 3% mineral wash is the one warm cue left.
   Every selector out-ranks its light counterpart, so light mode is untouched. */
html[data-theme="dark"][data-branch="contact"]{--porcelain:#0A0C10;--paper:#15181E;--ink:#F2F1EC;--ink-soft:#B9BDC4;--muted:#7E848C;--line:rgba(242,241,236,.10);--line-strong:rgba(242,241,236,.20);color-scheme:dark}
html[data-theme="dark"][data-branch="contact"] .grain{opacity:.07;mix-blend-mode:overlay}
/* The nav carries the page's mineral wash so the two meet without a step. */
html[data-theme="dark"][data-branch="contact"] .nav{background:linear-gradient(90deg,rgba(242,238,229,.03),transparent 60%),rgba(10,12,16,.94);color:var(--ink)}
html[data-theme="dark"][data-branch="contact"] .nav.scrolled{background:linear-gradient(90deg,rgba(242,238,229,.03),transparent 60%),rgba(10,12,16,.96)}
html[data-theme="dark"][data-branch="contact"] .nav .brand-mark{filter:invert(1) brightness(1.7)}
html[data-theme="dark"][data-branch="contact"] .nav .btn-dark{background:var(--ink);color:var(--porcelain)}
html[data-theme="dark"] .ct-page{background:var(--porcelain)}
html[data-theme="dark"] .ct-page::before{background:linear-gradient(90deg,rgba(242,238,229,.03),transparent 60%)}
html[data-theme="dark"] .ct-numeral{color:var(--accent);opacity:.12}
html[data-theme="dark"] .ct-page form input:not([name="website"]),html[data-theme="dark"] .ct-page form textarea{border-bottom-color:rgba(242,241,236,.40)}
html[data-theme="dark"] .ct-page form input::placeholder,html[data-theme="dark"] .ct-page form textarea::placeholder{color:#8790A0}
html[data-theme="dark"] .ct-send{background:var(--accent);color:var(--porcelain)}
html[data-theme="dark"] .ct-send:hover{background:var(--accent-soft)}
html[data-theme="dark"] .ct-error{color:#FF9C8E}
html[data-theme="dark"][data-branch="contact"] .ct-page form :is(input:not([name="website"]),textarea):-webkit-autofill{-webkit-text-fill-color:var(--ink);caret-color:var(--ink);-webkit-box-shadow:inset 0 0 0 1000px var(--porcelain);box-shadow:inset 0 0 0 1000px var(--porcelain);transition:background-color 600000s 0s,color 600000s 0s}
