/* BrandRockey webfonts.
   NOTE: no font binaries were supplied with the brief. These are Google Fonts
   substitutions chosen to match the "premium modern grotesk" direction.
   Familjen Grotesk = display/headline. Public Sans = body/UI. Martian Mono = labels.
   Swap for licensed originals by replacing this file's @import with @font-face rules. */
/* vietnamese */
@font-face {
  font-family: 'Familjen Grotesk';
  font-style: italic;
  font-weight: 400 700;
  font-display: swap;
  src: url("/assets/fonts/413f22f5-1631-4891-a7ee-33fd889202ce.woff2") format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
  font-family: 'Familjen Grotesk';
  font-style: italic;
  font-weight: 400 700;
  font-display: swap;
  src: url("/assets/fonts/54441689-c5e4-4bbf-906b-2b52e8998d06.woff2") format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Familjen Grotesk';
  font-style: italic;
  font-weight: 400 700;
  font-display: swap;
  src: url("/assets/fonts/20ac206c-349a-4a73-a75d-71900688ec11.woff2") format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* vietnamese */
@font-face {
  font-family: 'Familjen Grotesk';
  font-style: normal;
  font-weight: 400 700;
  font-display: swap;
  src: url("/assets/fonts/17039769-0e2e-44e1-a0a8-3ca53d7b8d63.woff2") format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
  font-family: 'Familjen Grotesk';
  font-style: normal;
  font-weight: 400 700;
  font-display: swap;
  src: url("/assets/fonts/7d381029-a45f-498a-a918-5555a95e136b.woff2") format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Familjen Grotesk';
  font-style: normal;
  font-weight: 400 700;
  font-display: swap;
  src: url("/assets/fonts/14b73e66-f0d7-48d2-adfd-8269cd36119e.woff2") format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* cyrillic-ext */
@font-face {
  font-family: 'Martian Mono';
  font-style: normal;
  font-weight: 300 700;
  font-stretch: 100%;
  font-display: swap;
  src: url("/assets/fonts/204dfc5d-6504-4296-9627-a320f1b5f768.woff2") format('woff2');
  unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
/* cyrillic */
@font-face {
  font-family: 'Martian Mono';
  font-style: normal;
  font-weight: 300 700;
  font-stretch: 100%;
  font-display: swap;
  src: url("/assets/fonts/af604db9-599f-4aac-9c26-5e97a8aa7d5e.woff2") format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
/* latin-ext */
@font-face {
  font-family: 'Martian Mono';
  font-style: normal;
  font-weight: 300 700;
  font-stretch: 100%;
  font-display: swap;
  src: url("/assets/fonts/214fee35-6f59-4f79-9db9-d70301d14c03.woff2") format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Martian Mono';
  font-style: normal;
  font-weight: 300 700;
  font-stretch: 100%;
  font-display: swap;
  src: url("/assets/fonts/f9cd643f-0dbd-48b7-8523-25855bcfdfa5.woff2") format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* vietnamese */
@font-face {
  font-family: 'Public Sans';
  font-style: italic;
  font-weight: 300 800;
  font-display: swap;
  src: url("/assets/fonts/edec33cc-ba8c-4d5d-a9e6-2520b079b8b9.woff2") format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
  font-family: 'Public Sans';
  font-style: italic;
  font-weight: 300 800;
  font-display: swap;
  src: url("/assets/fonts/65bcdd81-4dc0-4826-9aca-bb14e76d1ef1.woff2") format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Public Sans';
  font-style: italic;
  font-weight: 300 800;
  font-display: swap;
  src: url("/assets/fonts/eacb0bf8-67f1-4fc0-9981-9b8338bb862f.woff2") format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* vietnamese */
@font-face {
  font-family: 'Public Sans';
  font-style: normal;
  font-weight: 300 800;
  font-display: swap;
  src: url("/assets/fonts/514ca13d-dfc8-4db0-a788-1f01f1b85e19.woff2") format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
  font-family: 'Public Sans';
  font-style: normal;
  font-weight: 300 800;
  font-display: swap;
  src: url("/assets/fonts/d171d154-bf6e-4672-80d9-aa6a387e5e2f.woff2") format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Public Sans';
  font-style: normal;
  font-weight: 300 800;
  font-display: swap;
  src: url("/assets/fonts/fb257de5-b2cf-4e68-bc40-45670e150f78.woff2") format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}


:root{
/* --- raw palette --- */
--br-paper:#F4F0E9;          /* warm off-white, primary background */
--br-paper-2:#EAE4D9;        /* second warm surface / section banding */
--br-chalk:#FDFBF7;          /* lifted card surface on paper */
--br-clay:#D7CDBD;           /* hairline borders, dividers on paper */
--br-clay-deep:#B3A692;      /* muted strokes, disabled type on paper */
--br-ink:#0E0C0B;            /* deep warm black, primary type + dark sections */
--br-ink-2:#1A1614;          /* dark section surface, one step up from ink */
--br-espresso:#2B2118;       /* secondary dark, warm brown-black */
--br-smoke:#6B6259;          /* secondary type on paper */
--br-flare:#FF2D6F;          /* THE accent. Strategic use only. */
--br-flare-deep:#D8155A;     /* accent pressed / accent on light */
--br-flare-soft:#FFD9E5;     /* accent tint, highlight fills */
--br-volt:#E8FF3A;           /* rare 2nd signal: data, in-motion states */
--br-signal-good:#1F7A5C;
--br-signal-warn:#B87500;
--br-signal-bad:#C31F2E;

/* --- semantic: light (default) --- */
--surface-page:var(--br-paper);
--surface-band:var(--br-paper-2);
--surface-card:var(--br-chalk);
--surface-inverse:var(--br-ink);
--surface-accent:var(--br-flare);
--surface-accent-soft:var(--br-flare-soft);
--text-heading:var(--br-ink);
--text-body:var(--br-espresso);
--text-muted:var(--br-smoke);
--text-accent:var(--br-flare-deep);
--text-on-inverse:var(--br-paper);
--text-on-accent:#FFFFFF;
--border-hairline:var(--br-clay);
--border-strong:var(--br-ink);
--border-accent:var(--br-flare);
--focus-ring:var(--br-flare);
--selection-bg:var(--br-flare);
--selection-fg:#FFFFFF;
}

/* Dark sections are opt-in per block, not a whole-site theme. */
[data-theme="dark"]{
--surface-page:var(--br-ink);
--surface-band:var(--br-ink-2);
--surface-card:var(--br-ink-2);
--surface-inverse:var(--br-paper);
--text-heading:var(--br-paper);
--text-body:#DCD5CA;
--text-muted:#8E857A;
--text-accent:var(--br-flare);
--text-on-inverse:var(--br-ink);
--border-hairline:#332C26;
--border-strong:var(--br-paper);
}

:root{
--font-display:"Familjen Grotesk","Helvetica Neue",Arial,sans-serif;
--font-body:"Public Sans","Helvetica Neue",Arial,sans-serif;
--font-mono:"Martian Mono",ui-monospace,"SF Mono",monospace;

/* display scale — clamp()ed for the animation-first site */
--type-mega:clamp(3.5rem,11vw,10.5rem);   /* hero lines, 1 per line */
--type-d1:clamp(2.75rem,7vw,6.5rem);      /* section statements */
--type-d2:clamp(2rem,4.6vw,4rem);         /* sub statements */
--type-h1:clamp(1.75rem,3vw,2.75rem);
--type-h2:1.5rem;
--type-h3:1.1875rem;
--type-body-lg:1.1875rem;
--type-body:1rem;
--type-body-sm:0.875rem;
--type-label:0.75rem;   /* mono eyebrow */
--type-micro:0.6875rem;

--lh-mega:0.86; /* @kind font */
--lh-display:0.94; /* @kind font */
--lh-heading:1.08; /* @kind font */
--lh-body:1.55; /* @kind font */
--lh-tight:1.2; /* @kind font */

--ls-mega:-0.045em; /* @kind font */
--ls-display:-0.03em; /* @kind font */
--ls-heading:-0.015em; /* @kind font */
--ls-body:0em; /* @kind font */
--ls-label:0.16em; /* @kind font */   /* mono eyebrows are always tracked out */

--weight-body:400; /* @kind font */
--weight-medium:500; /* @kind font */
--weight-semi:600; /* @kind font */
--weight-bold:700; /* @kind font */
}

:root{
/* 4px base, editorial jumps at the top end */
--sp-1:4px;--sp-2:8px;--sp-3:12px;--sp-4:16px;--sp-5:24px;--sp-6:32px;
--sp-7:48px;--sp-8:64px;--sp-9:96px;--sp-10:128px;--sp-11:180px;--sp-12:240px;

--gutter:clamp(20px,5vw,72px); /* @kind spacing */   /* page side padding */
--section-y:clamp(80px,12vw,180px); /* @kind spacing */ /* vertical rhythm between story beats */
--stack:var(--sp-5); /* @kind spacing */
--max-measure:62ch; /* @kind spacing */              /* body copy line length cap */
--max-page:1680px; /* @kind spacing */
--grid-cols:12; /* @kind other */
--grid-gap:clamp(16px,2vw,32px); /* @kind spacing */
}

:root{
/* Corners stay near-square. Roundness is reserved for pills and media chips. */
--radius-0:0px;
--radius-sm:2px;
--radius-md:4px;
--radius-lg:10px;      /* media / feed cards only */
--radius-pill:999px;
--border-hair:1px; /* @kind spacing */
--border-mid:1.5px; /* @kind spacing */
--border-heavy:2px; /* @kind spacing */
--rule-heavy:6px; /* @kind spacing */       /* the editorial section rule */
}

:root{
/* Almost no soft shadows. Depth comes from offset "print" shadows and hairlines. */
--shadow-none:none;
--shadow-print:4px 4px 0 var(--br-ink);
--shadow-print-accent:4px 4px 0 var(--br-flare);
--shadow-lift:0 1px 2px rgba(14,12,11,.06),0 10px 28px rgba(14,12,11,.08);
--shadow-overlay:0 24px 80px rgba(14,12,11,.28);
--overlay-scrim:rgba(14,12,11,.72); /* @kind color */
--blur-nav:saturate(140%) blur(14px); /* @kind other */
}

:root{
--ease-out:cubic-bezier(.16,1,.3,1); /* @kind other */      /* default reveal — fast out, long settle */
--ease-inout:cubic-bezier(.76,0,.24,1); /* @kind other */   /* masks, clip-paths, page transitions */
--ease-snap:cubic-bezier(.2,.9,.1,1); /* @kind other */     /* buttons, magnetic hover */
--dur-micro:120ms; /* @kind other */
--dur-fast:220ms; /* @kind other */
--dur-base:420ms; /* @kind other */
--dur-slow:720ms; /* @kind other */
--dur-cinema:1200ms; /* @kind other */
--stagger:60ms; /* @kind other */
--hover-lift:-2px; /* @kind other */
--press-scale:.97; /* @kind other */
}
@media (prefers-reduced-motion:reduce){
:root{--dur-micro:0ms; /* @kind other */--dur-fast:0ms; /* @kind other */--dur-base:0ms; /* @kind other */--dur-slow:0ms; /* @kind other */--dur-cinema:0ms; /* @kind other */--stagger:0ms; /* @kind other */--hover-lift:0px; /* @kind other */--press-scale:1; /* @kind other */}
}

*,*::before,*::after{box-sizing:border-box}
body{margin:0;background:var(--surface-page);color:var(--text-body);font-family:var(--font-body);font-size:var(--type-body);line-height:var(--lh-body);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
h1,h2,h3,h4{font-family:var(--font-display);color:var(--text-heading);margin:0;text-wrap:balance}
h1{font-size:var(--type-d1);line-height:var(--lh-display);letter-spacing:var(--ls-display);font-weight:var(--weight-bold);text-transform:uppercase}
h2{font-size:var(--type-d2);line-height:var(--lh-display);letter-spacing:var(--ls-display);font-weight:var(--weight-bold);text-transform:uppercase}
h3{font-size:var(--type-h1);line-height:var(--lh-heading);letter-spacing:var(--ls-heading);font-weight:var(--weight-bold)}
h4{font-size:var(--type-h3);line-height:var(--lh-heading);letter-spacing:var(--ls-heading);font-weight:var(--weight-semi)}
p{margin:0;max-width:var(--max-measure);text-wrap:pretty}
a{color:var(--text-accent);text-decoration:none;border-bottom:var(--border-hair) solid currentColor;transition:color var(--dur-fast) var(--ease-snap),border-color var(--dur-fast) var(--ease-snap)}
a:hover{color:var(--br-ink);border-color:var(--br-flare)}
::selection{background:var(--selection-bg);color:var(--selection-fg)}
:focus-visible{outline:var(--border-heavy) solid var(--focus-ring);outline-offset:3px}
.br-label{font-family:var(--font-mono);font-size:var(--type-label);letter-spacing:var(--ls-label);text-transform:uppercase;color:var(--text-muted);font-weight:500}
.br-mega{font-family:var(--font-display);font-size:var(--type-mega);line-height:var(--lh-mega);letter-spacing:var(--ls-mega);font-weight:var(--weight-bold);text-transform:uppercase;color:var(--text-heading);margin:0}
.br-page{max-width:var(--max-page);margin:0 auto;padding-inline:var(--gutter)}



html,body{height:100%}html{scrollbar-gutter:stable}
#root{min-height:100%}
a{border:none}
@media (hover:hover){body{cursor:none}body *{cursor:none!important}}
.br-skip{position:absolute;left:-9999px;top:0;z-index:10000;background:var(--br-ink);color:var(--br-paper);font-family:var(--font-mono);font-size:12px;letter-spacing:.16em;text-transform:uppercase;padding:12px 18px}
.br-skip:focus{left:12px;top:12px}
@media (max-width:900px){[style*="1.25fr 0.75fr"],[style*="0.85fr 1.15fr"],[style*="grid-template-columns: 1fr 1fr"]{grid-template-columns:1fr!important}}#ov-portfolio-label span:nth-child(2){color:#110E0F!important}
#ov-portfolio-head h2>span:first-child>span{color:var(--focus-ring)!important}
#ov-portfolio-note{color:var(--focus-ring)!important}


/* --- SEO build additions --- */
html.js:not(.br-ready) #root{visibility:hidden}
.br-faq-list{border-top:var(--border-mid) solid var(--border-strong)}
.br-faq{border-bottom:var(--border-hair) solid var(--border-hairline)}
.br-faq summary{list-style:none;display:flex;justify-content:space-between;align-items:center;gap:24px;padding:28px 0}
.br-faq summary::-webkit-details-marker{display:none}
.br-faq summary h3{font-size:var(--type-h2);text-transform:none}
.br-faq-icon{font-family:var(--font-mono);font-size:1.5rem;color:var(--br-flare);transition:transform var(--dur-fast) var(--ease-snap);flex:none}
.br-faq[open] .br-faq-icon{transform:rotate(45deg)}
.br-faq p{padding:0 0 28px;font-size:var(--type-body-lg);color:var(--text-body)}
@media (max-width:900px){
  .br-hero-grid,.br-split,[style*="fr) minmax(0"],[style*="0.9fr 1.1fr"],[style*="1.15fr 0.85fr"]{grid-template-columns:1fr!important}
  .br-hero-grid>div:last-child{margin-top:8px}
}
@media (max-width:760px){
  [style*="minmax(320px"],[style*="minmax(300px"],[style*="minmax(280px"]{grid-template-columns:1fr!important}
  footer [style*="minmax(150px"]{grid-template-columns:1fr 1fr!important}
  footer [style*="minmax(150px"]>div:last-child{grid-column:1/-1}
  a[href^="mailto:"]{overflow-wrap:anywhere}
  header>div{padding-block:12px!important}
  header>div>a:first-child{font-size:18px!important}
  header button{padding:8px 12px!important;font-size:10px!important;letter-spacing:.1em!important}
  header nav{gap:14px!important;overflow-x:auto;scrollbar-width:none;-webkit-overflow-scrolling:touch}
  header nav::-webkit-scrollbar{display:none}
  header>div{flex-wrap:wrap;row-gap:10px!important;gap:14px!important}
  header>div>nav{order:3;width:100%;margin-left:0!important}
  header>div>*:nth-child(3){margin-left:auto}
}