/* Brand positions only; product sections retain the existing design. */
.rockform-wordmark{display:block;height:auto;flex:none}.wordmark-header{width:200px}.wordmark-footer{width:190px}.wordmark-small{width:140px}.wordmark-hero{width:min(46vw,850px)}.brand-home{display:inline-flex;color:var(--ink)}
.brand-header{max-width:none;height:80px;min-height:80px;padding-inline:3.5vw;display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);gap:20px}.brand-header nav{display:flex;justify-content:center;gap:26px;font-size:10px;font-weight:500;letter-spacing:.11em;text-transform:uppercase;white-space:nowrap}.header-controls{display:flex;justify-content:flex-end;align-items:center;gap:24px}.header-project{border:1px solid #9a998f;border-radius:3px;padding:10px 15px;font-size:10px;letter-spacing:.1em;text-transform:uppercase;white-space:nowrap}.header-project:hover{background:#e7e1d7;text-decoration:none}.language-label{font-size:10px;letter-spacing:.1em}.brand-header .mobile-project-link{display:none}.brand-header .menu-toggle{display:none}
.brand-hero{position:relative;isolation:isolate;min-height:650px;height:90svh;max-height:1050px;display:grid;place-items:center;color:var(--ink);overflow:hidden}.brand-hero #hero-image{position:absolute;inset:0;z-index:-2}.brand-hero .hero-frame{height:100%;width:100%;aspect-ratio:auto;min-height:0}.brand-hero .image-placeholder{inset: auto 3.5vw 28px;display:flex;align-items:flex-start;justify-content:flex-end;text-align:left;padding:0;gap:5px}.brand-hero .image-icon{display:none}.brand-hero .image-placeholder strong{font-size:10px;letter-spacing:.15em}.brand-hero .image-purpose{font-size:10px;letter-spacing:.06em}.brand-hero .image-spec{display:flex;flex-direction:row;align-items:center;gap:12px;margin:0;font-size:10px}.brand-hero .image-spec b{font-size:11px;font-weight:500}.brand-hero .image-spec:after{display:none}.brand-hero .image-caption{bottom:18px;right:3.5vw;left:auto}.brand-hero-content{text-align:center;padding:85px 24px 135px;display:flex;flex-direction:column;align-items:center}.brand-hero h1{margin:0;line-height:1}.hero-serif{font-family:var(--font-editorial);font-style:italic;font-weight:400;color:var(--orange);font-size:clamp(54px,5.1vw,86px);line-height:1;margin:14px 0 30px;letter-spacing:-.025em}.hero-tagline{font-size:11px;letter-spacing:.22em;line-height:1.9;text-transform:uppercase;margin:0 0 35px}.brand-hero .hero-actions{display:flex;flex-direction:row;justify-content:center;gap:14px}.brand-hero .button{min-height:44px;padding:12px 22px;font-size:10px;letter-spacing:.12em;text-transform:uppercase;border-color:var(--orange);background:var(--orange);gap:20px}.brand-hero .button:hover{background:#90452e}.brand-hero .hero-secondary{background:transparent;color:var(--ink);border-color:#696a60}.brand-hero .hero-secondary:hover{background:#f4f1eb80}.hero-eyebrow{position:absolute;top:28px;left:3.5vw;font-size:10px;letter-spacing:.2em;margin:0}.hero-intro{padding-block:34px;display:grid;grid-template-columns:1fr 1fr;gap:22px 60px;border-bottom:1px solid var(--line)}.hero-intro .launch{font-size:12px;align-self:start;margin-top:5px}.hero-description{max-width:620px;font-size:17px;margin:0}.hero-intro .hero-foot{grid-column:1/-1;padding:0;font-size:10px}
/* The same fallback also supports a future image without making text illegible. */
.brand-hero:has(.image-picture):before{content:'';position:absolute;inset:0;z-index:-1;background:rgba(244,241,235,.58)}
@media(max-width:1199px){.brand-header{height:auto;min-height:74px;grid-template-columns:1fr auto;gap:0;padding-inline:28px}.brand-header .wordmark-header{width:185px}.brand-header .menu-toggle{display:flex;align-items:center;gap:14px;background:none;border:0;color:var(--ink);font-size:12px;padding:24px 0 24px 16px}.header-controls{display:none}.brand-header nav{display:none;grid-column:1/-1;width:100%;flex-direction:column;gap:0;align-items:stretch;padding:8px 0 24px;font-size:12px}.brand-header nav.open,body:not(.has-js) .brand-header nav{display:flex}.brand-header nav a{padding:13px 0;border-bottom:1px solid var(--line)}.brand-header .mobile-project-link{display:block}.brand-header .mobile-project-link{color:var(--orange)}.wordmark-hero{width:66vw}.brand-hero{min-height:640px}.hero-intro{gap:24px}.hero-description{font-size:16px}}
@media(max-width:640px){.brand-header{min-height:68px;padding-inline:22px;flex-wrap:initial}.brand-header .wordmark-header{width:165px}.brand-header .menu-toggle{padding-block:22px}.brand-hero{min-height:620px;height:calc(100svh - 68px);max-height:900px}.wordmark-hero{width:82vw}.brand-hero-content{padding:105px 20px 150px;width:100%}.hero-serif{font-size:52px;margin:14px 0 26px}.hero-tagline{font-size:9px;letter-spacing:.17em;margin-bottom:26px}.brand-hero .hero-actions{flex-direction:column;align-items:stretch;width:210px;gap:10px}.brand-hero .button{min-height:44px;padding:12px 14px;font-size:9px}.brand-hero .image-placeholder{inset:auto 22px 24px;gap:5px}.brand-hero .image-purpose{font-size:8px;letter-spacing:.03em}.brand-hero .image-placeholder strong{font-size:9px}.hero-eyebrow{left:22px;top:24px;font-size:9px}.hero-intro{display:block;padding-block:26px}.hero-intro .launch{font-size:11px;margin:0 0 18px}.hero-description{font-size:15px}.hero-intro .hero-foot{display:flex;flex-direction:column;gap:5px;margin-top:22px}.wordmark-footer{width:165px}}

/* First gallery slide is wide; last is portrait. CSS keeps both ends centered at resize. */
.gallery-track{padding-inline-start:max(22px,calc((100vw - min(57vw,780px))/2));padding-inline-end:max(22px,calc((100vw - min(32vw,430px))/2))}
@media(max-width:640px){.gallery-track{padding-inline-start:max(22px,7vw);padding-inline-end:max(22px,12vw)}}