/* Company-only layout and motion. Legacy product styles are not changed. */
:root {
  --company-ease: cubic-bezier(.22,1,.36,1);
  --company-header-height: 80px;
  --company-content: 1180px;
  --faint: #aaa5c9;
  --paper-soft: #b4afd1;
}
html[data-theme=light] { --faint:#5b547e; --paper-soft:#5b547e; --lavender:#4338ca; --lavender-soft:#4338ca; --sage:#326a54; --copper:#9c531f; --champagne:#70541f; --champagne-soft:#70541f; }
html[data-contrast=more] { --faint:var(--cream); --paper-soft:var(--paper-ink); --rule:currentColor; }
html { scroll-behavior:auto; }
body { overflow-x:clip; }
.wrap { width:100%; max-width:var(--company-content); margin-inline:auto; padding-inline:clamp(20px,4.5vw,48px); }
main, .site-footer { min-width:0; }
main :is(h1,h2,h3,p,li,dd,a), .site-footer { overflow-wrap:anywhere; }
main [id] { scroll-margin-top:calc(var(--company-header-height) + 20px); }
.site-header { position:sticky; top:0; }
.site-header > .wrap { display:grid; grid-template-columns:minmax(0,1fr) auto minmax(0,1fr); gap:14px; align-items:center; min-height:80px; padding-block:8px; }
.site-header .brand { justify-self:start; margin:0; min-width:0; }
.site-header .nav { display:flex; justify-self:center; justify-content:center; flex-wrap:wrap; gap:0; }
.site-header .nav a { min-height:44px; padding:10px 12px; }
.company-tools { display:flex; align-items:center; justify-content:center; gap:10px; justify-self:end; }
.company-tools .icon-btn { width:48px; height:48px; flex:0 0 auto; background:var(--ink-1); }
:is(a,button,input,select,textarea,summary,[tabindex]):focus-visible { outline:3px solid var(--lavender-soft); outline-offset:4px; }
.skip { z-index:1000; }
.skip:focus { position:fixed; }
.hero, .home-hero { min-height:clamp(450px,70svh,780px); padding-block:clamp(64px,8vw,116px); isolation:isolate; overflow:hidden; }
.hero > .wrap, .home-hero-inner, .contact-intro-premium { display:flex; flex-direction:column; align-items:center; justify-content:center; text-align:center; }
.hero .eyebrow, .contact-intro-premium .eyebrow { width:100%; justify-content:center; margin-inline:auto; }
.hero .eyebrow::before, .contact-intro-premium .eyebrow::before { display:none; }
.hero .display { max-width:14ch; margin-inline:auto; text-align:center; font-size:clamp(52px,8vw,128px); line-height:1.04; }
.hero--press .display { max-width:18ch; }
.hero .display > span { display:block; }
.hero .display em { display:inline-block; }
.hero .lede, .contact-intro-premium .lede { max-width:54ch; text-align:center; margin-inline:auto; }
.hero-mark, .home-mark { display:block; margin-inline:auto; width:clamp(70px,8vw,106px); height:clamp(70px,8vw,106px); flex:none; }
.home-mark { margin-bottom:24px; }
.hero .hero-mark { margin-top:4px; margin-bottom:24px; }
.home-wordmark { text-align:center; max-width:100%; line-height:.96; }
.home-wordmark > span, .home-wordmark > em { transform:none; }
.home-tagline { max-width:54ch; }
.home-ambient { opacity:.075; }
.home-ambient span { flex:0 0 auto; padding-right:.24em; }
.hero::before, .home-hero::before { opacity:.8; transform:none; }
.company-reveal, .company-stagger > * { opacity:1; transform:none; }
/* All company section titles and their supporting copy share a centered axis. */
main > .section > .wrap, .home-section-head, .home-studio-grid, .home-access-row { text-align:center; }
main :is(.section,.home-work,.home-studio) .eyebrow { justify-content:center; text-align:center; margin-inline:auto; }
main :is(.section,.home-work,.home-studio) .eyebrow::before { display:none; }
main :is(.section,.home-work,.home-studio) :is(h2,.h2) { max-width:30ch; text-align:center; margin-inline:auto; }
main :is(.section,.home-work,.home-studio) :is(.lede,.principles-copy,.kit-copy,.home-studio-copy) { text-align:center; margin-inline:auto; }
main .section .lede { max-width:62ch; margin-inline:auto!important; }
.home-section-head { display:flex; flex-direction:column; align-items:center; justify-content:center; gap:22px; margin-inline:auto; max-width:860px; }
.home-section-head > p { max-width:60ch; margin-inline:auto; }
.home-studio-grid, .principles-grid, .kit-panel, .feature { display:grid; grid-template-columns:minmax(0,1fr); justify-items:center; gap:30px; }
.home-studio-grid > *, .principles-grid > *, .kit-panel > *, .feature > * { width:100%; min-width:0; }
.home-studio-copy, .principles-copy, .kit-copy { max-width:62ch; }
.home-studio-copy p, .principles-copy p, .kit-copy p { margin-inline:auto; }
.home-access-row { flex-direction:column; align-items:center; }
.home-access-row a { flex:initial; white-space:normal; text-align:center; justify-content:center; }
.feature > .panel { max-width:640px; width:100%; min-height:220px; }
main .section .wrap > .company-reveal:has(> .btn), .home-studio-actions, .kit-links, .hero-cta { justify-content:center; text-align:center; }
.home-work-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
.home-card, .craft, .voice, .reading, .standard-card, .craft-process-grid article { text-align:center; min-width:0; }
.home-card { align-items:center; justify-content:center; }
.home-card p, .craft p, .voice p, .standard-card p, .craft-process-grid p { margin-inline:auto; }
.craft .mark, .voice .mark { margin-inline:auto; }
.home-card-link, .voice .swatch { justify-content:center; }
.craft .tag { align-self:center; }
.standard-kicker { margin-bottom:24px; }
.update-list { max-width:940px; margin-inline:auto; }
.update-list li { text-align:center; }
.update-list h3 { margin-inline:auto; padding-inline:26px; }
.update-list p { margin-inline:auto; }
.press-facts { width:100%; max-width:960px; text-align:center; margin-inline:auto; }
.press-facts a { justify-content:center; }
.site-footer > .wrap, .site-footer.home-footer > .wrap { display:flex; flex-wrap:wrap; justify-content:center; gap:28px; text-align:center; }
.site-footer .footer-brand, .footer-cols, .home-footer-links, .footer-legal, .home-footer-legal { justify-content:center; }
.site-footer p { margin-inline:auto; }
.footer-col { display:flex; flex-direction:column; align-items:center; }
.footer-col a { justify-content:center; max-width:30ch; }
.footer-legal, .home-footer-legal { align-items:center; width:100%; }
/* Preserve form usability: headings centered, field labels and entered text left aligned. */
.contact-wrap { max-width:980px!important; }
.contact-intro-premium { max-width:780px; }
.contact-form-head { display:flex; flex-direction:column; align-items:center; text-align:center; gap:12px; }
.contact-card--form :is(label,input,textarea,select,.help,.field-error) { text-align:left; }
.contact-card--form .actions { justify-content:center; }
.contact-route-list { flex-wrap:wrap; justify-content:center; overflow:visible; }
.direct-premium { text-align:center; margin-inline:auto; }
.btn { height:auto; min-height:52px; padding:14px 26px; white-space:normal; text-align:center; line-height:1.3; }
/* Native modal supplies focus containment, Escape, and inert background behavior. */
.company-access-dialog { position:fixed; inset:0; margin:auto; padding:0; width:min(460px,calc(100vw - 28px)); max-width:none; max-height:min(86vh,780px); max-height:min(86dvh,780px); overflow:auto; overscroll-behavior:contain; border:1px solid var(--rule); border-radius:22px; background:var(--ink-1); color:var(--cream); box-shadow:var(--shadow-2); }
.company-access-dialog:not([open]) { display:none; }
.company-access-dialog::backdrop { background:rgba(5,4,15,.7); }
.company-dialog-head { display:flex; align-items:start; justify-content:space-between; gap:16px; position:sticky; top:0; z-index:2; padding:22px; background:var(--ink-1); border-bottom:1px solid var(--rule); }
.company-dialog-head h2 { font-family:var(--serif); font-size:30px; line-height:1.1; font-weight:400; }
.company-dialog-head p { font-size:13px; color:var(--faint); margin-top:6px; }
.company-dialog-head .icon-btn { flex:none; font:26px var(--sans); }
.company-dialog-body { padding:8px 22px 22px; }
.company-setting { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:12px; padding:16px 0; border-bottom:1px solid var(--rule); }
.company-setting > div:first-child { min-width:0; }
.company-setting span { font-size:16px; }
.company-setting small { display:block; font-size:13px; color:var(--faint); max-width:28ch; }
.company-switch { flex:none; position:relative; width:58px; height:44px; padding:7px 3px; border:1px solid var(--rule); border-radius:999px; background:var(--ink-2); cursor:pointer; }
.company-switch span { display:block; width:26px; height:26px; border-radius:50%; background:var(--cream); }
.company-switch[aria-checked=true] { background:var(--lavender); border-color:var(--lavender); }
.company-switch[aria-checked=true] span { margin-left:auto; background:var(--ink-0); }
.company-segment, .company-stepper { display:flex; align-items:center; flex-wrap:wrap; gap:4px; }
.company-segment button, .company-stepper button, .company-motion-actions button, .company-reset { min-height:44px; min-width:44px; padding:10px 12px; font:inherit; font-size:14px; border:1px solid var(--rule); border-radius:12px; color:var(--cream); background:var(--ink-2); cursor:pointer; }
.company-segment [aria-pressed=true] { background:var(--lavender); color:var(--ink-0); }
.company-stepper output { padding-inline:4px; min-width:54px; text-align:center; }
.company-motion-status { color:var(--cream-2); font-size:14px; margin-top:14px; }
.company-motion-actions { display:flex; flex-wrap:wrap; gap:8px; margin-block:12px; }
.company-reset { width:100%; margin-top:22px; }
.company-access-dialog button:disabled { opacity:.55; cursor:default; }
html[data-targets=large] :is(.company-tools button,.company-access-dialog button,.nav a,.footer-col a) { min-width:52px; min-height:52px; }
/* Only this resolved preference starts decoration. No-JS and reduced-motion start static. */
html[data-company-motion=allow] .hero::before, html[data-company-motion=allow] .home-hero::before { animation:companyAmbientGlow 8s ease-in-out infinite alternate; }
html[data-company-motion=allow] :is(.hero-mark,.home-mark) { animation:companyMarkFloat 6.8s ease-in-out infinite; }
html[data-company-motion=allow] :is(.hero .display,.home-wordmark,.contact-intro-premium .display) { animation:companyTitleFloat 8s ease-in-out infinite; }
html[data-company-motion=allow] .home-ambient span { animation:companyAmbientTrack 32s linear infinite; }
html[data-company-motion=allow] :is(.btn,.icon-btn,.home-card,.craft,.standard-card) { transition:transform .24s var(--company-ease),background-color .2s,border-color .2s; }
@keyframes companyMarkFloat { 0%,100%{transform:translate3d(0,0,0) rotate(-.5deg)}50%{transform:translate3d(0,-7px,0) rotate(1deg)} }
@keyframes companyTitleFloat { 0%,100%{transform:translate3d(0,0,0)}50%{transform:translate3d(0,-3px,0)} }
@keyframes companyAmbientGlow { from{opacity:.68;transform:scale(.985)}to{opacity:1;transform:scale(1.035)} }
@keyframes companyAmbientTrack { from{transform:translate3d(0,0,0)}to{transform:translate3d(-100%,0,0)} }
html[data-company-paused=true] *, html[data-company-paused=true] ::before, html[data-company-paused=true] ::after { animation-play-state:paused!important; }
html[data-company-motion=reduce] *, html[data-company-motion=reduce] ::before, html[data-company-motion=reduce] ::after { animation:none!important; transition:none!important; scroll-behavior:auto!important; }
html[data-company-motion=reduce] :is(.hero-mark,.home-mark,.hero .display,.home-wordmark,.company-reveal,.company-stagger > *,.btn,.icon-btn,.home-card,.craft,.standard-card,.reading,.nav a,.brand,.brand .mark,.back-chevron,.home-card-link span,.reading .mark,.panel) { transform:none!important; opacity:1!important; }
@media (hover:hover) and (pointer:fine) {
  html[data-company-motion=allow][data-company-paused=false] :is(.home-card,.craft,.standard-card):hover { transform:translateY(-3px); }
}
@media (max-width:1000px) {
  .site-header > .wrap { grid-template-columns:minmax(0,1fr) auto; }
  .site-header .nav { grid-column:1/-1; grid-row:2; justify-self:center; }
  .company-tools { grid-column:2; grid-row:1; }
  .home-work-grid, .standard-grid, .craft-process-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@media (max-width:600px) {
  .site-header { position:relative; }
  .site-header > .wrap { display:flex; flex-direction:column; gap:4px; padding-block:12px; }
  .site-header .brand { align-self:center; }
  .site-header .nav { order:1; gap:0; }
  .site-header .nav a { padding:10px; }
  .company-tools { order:2; gap:12px; margin-top:4px; }
  .hero,.home-hero { min-height:auto; padding-block:52px 68px; }
  .hero .display { font-size:clamp(46px,14vw,76px); max-width:100%; }
  .home-wordmark { font-size:clamp(58px,20vw,100px); }
  .home-tagline,.hero .lede { font-size:18px; }
  .section { padding-block:56px; }
  .home-work-grid,.standard-grid,.craft-process-grid,.press-facts,.grid-3,.voices,.readings { grid-template-columns:minmax(0,1fr); }
  .home-card { min-height:250px; }
  .hero-cta,.home-actions,.home-studio-actions { width:100%; }
  .hero-cta .btn,.home-actions .btn,.home-studio-actions .btn { width:100%; }
  .home-access-row a { max-width:100%; }
  .company-dialog-head,.company-dialog-body { padding-inline:16px; }
  .company-setting small { max-width:23ch; }
  main [id] { scroll-margin-top:20px; }
  html[data-company-motion=allow] .home-ambient span { animation-duration:36s; }
}
@media (min-width:1600px) { :root{--company-content:1320px} }
@media (min-width:2100px) { :root{--company-content:1440px} }
@media (prefers-contrast:more) { html:not([data-contrast=less]) { --faint:var(--cream); --paper-soft:var(--paper-ink); } }
@media (forced-colors:active) {
  .company-access-dialog,.company-dialog-head,.company-setting { background:Canvas; color:CanvasText; border-color:CanvasText; }
  :is(.company-switch,.company-segment button,.company-stepper button,.company-motion-actions button,.company-reset,.company-tools button) { background:ButtonFace; color:ButtonText; border:1px solid ButtonText; }
  .company-switch span { background:ButtonText; }
  .company-switch[aria-checked=true] span { background:Highlight; }
  .company-segment [aria-pressed=true] { outline:2px solid Highlight; }
  :focus-visible { outline-color:Highlight; }
  .hero::before,.home-hero::before,.home-ambient { display:none; }
}
@media print {
  *,::before,::after { animation:none!important; transition:none!important; }
  .company-tools,.company-access-dialog { display:none!important; }
}

/* Verified reflow and centering: grid children must be able to shrink at 230% text. */
.home-hero { grid-template-columns:minmax(0,1fr); min-width:0; }
.home-hero-inner { min-width:0; max-width:100%; }
.home-hero-inner > * { min-width:0; max-width:100%; }
.home-wordmark span:first-child, .home-wordmark em { transform:none; overflow-wrap:anywhere; max-width:100%; }
.home-wordmark { overflow-wrap:anywhere; }
.company-setting > div:first-child { flex:1 1 160px; }
.company-access-dialog { scroll-padding-block:100px 22px; }
@media (max-width:600px) { .home-hero-inner { padding-inline:20px; } }

/* Explicit centered product axis: title, description and CTA share the viewport center. */
html[data-company-page] .company-product {
  display:flex; flex-direction:column; align-items:center; justify-content:center;
  width:100%; max-width:860px; margin-inline:auto; gap:32px; text-align:center;
}
html[data-company-page] .company-product-copy {
  display:flex; flex-direction:column; align-items:center; width:100%; min-width:0;
}
html[data-company-page] .company-product-copy > :is(h2,p) {
  width:100%; max-width:54ch; text-align:center; margin-inline:auto!important;
}
html[data-company-page] .company-product-copy > .btn {
  align-self:center; margin-inline:auto; max-width:100%;
}
html[data-company-page] .company-product > .panel {
  width:100%; max-width:520px; min-height:220px; margin-inline:auto;
}
html[data-company-page][data-company-motion=allow] .company-product-mark {
  animation:companyMarkFloat 6.8s ease-in-out infinite;
}
html[data-company-page][data-company-motion=reduce] .company-product-mark {
  animation:none!important; transform:none!important;
}
@media (max-width:600px) {
  html[data-company-page] .company-product-copy > .btn { width:min(100%,320px); }
  html[data-company-page] .company-product > .panel { min-height:180px; }
}
