:root{
--fri-black:#000000;--fri-white:#ffffff;
--orange-vif:#f25626;--orange-vif-alt:#F05A1A;
--orange-light:#F28A61;--orange-light-alt:#ED7D31;
--orange-tint:#fdeee8;--orange-deep:#c33f16;
--grey-50:#f7f7f5;--grey-100:#f0f0ed;--grey-200:#e4e4e0;--grey-300:#d2d2cd;--grey-400:#a8a8a2;
--grey-500:#7d7d78;--grey-600:#5a5a56;--grey-700:#3d3d3a;--grey-800:#242422;--grey-900:#141413;
--text-strong:var(--fri-black);--text-body:var(--grey-800);--text-muted:var(--grey-600);
--text-subtle:var(--grey-500);--text-inverse:var(--fri-white);--text-link:var(--fri-black);
--surface-page:var(--fri-white);--surface-raised:var(--fri-white);--surface-sunken:var(--grey-50);
--surface-card:var(--fri-white);--surface-inverse:var(--fri-black);--surface-accent:var(--orange-tint);
--brand-accent:var(--orange-vif);--brand-accent-hover:var(--orange-deep);--brand-accent-soft:var(--orange-light);
--text-accent:var(--orange-vif);
--border-hairline:var(--grey-200);--border-strong:var(--fri-black);--border-muted:var(--grey-300);
--action-bg:var(--fri-black);--action-bg-hover:var(--grey-800);--action-bg-active:var(--grey-900);
--action-fg:var(--fri-white);
--action-ghost-bg-hover:var(--grey-100);
--action-accent-bg:var(--orange-vif);--action-accent-bg-hover:var(--orange-deep);--action-accent-fg:var(--fri-white);
--focus-ring:var(--fri-black);
--status-attention-fg:var(--orange-vif);--status-attention-bg:var(--orange-tint);
--status-neutral-fg:var(--text-body);--status-neutral-bg:var(--grey-100);
}
:root{
--text-display-1:clamp(48px,6vw,88px);--text-display-2:clamp(38px,4.4vw,64px);
--text-h1:44px;--text-h2:32px;--text-h3:24px;--text-h4:19px;
--text-lead:20px;--text-body-lg:18px;--text-body-md:16px;--text-body-sm:14px;--text-caption:13px;
--text-eyebrow:12px;
--lh-tight:1.04;
--lh-snug:1.18;
--lh-heading:1.24;
--lh-body:1.62;
--lh-loose:1.8;
--ls-display:-0.025em;
--ls-heading:-0.015em;
--ls-body:0em;
--ls-eyebrow:0.18em;
--ls-caps:0.06em;
--fw-light:300;
--fw-regular:400;
--fw-medium:500;
--fw-semibold:600;
--fw-bold:700;
--measure-narrow:46ch;
--measure-body:66ch;
--measure-wide:80ch;
}
:root{
--space-0:0px;--space-1:4px;--space-2:8px;--space-3:12px;--space-4:16px;--space-5:20px;
--space-6:24px;--space-8:32px;--space-10:40px;--space-12:48px;--space-16:64px;--space-20:80px;
--space-24:96px;--space-32:128px;--space-40:160px;
--gutter:24px;--container-max:1240px;--container-narrow:820px;
--section-y:var(--space-24);--section-y-sm:var(--space-16);
}
:root{
--radius-none:0px;--radius-xs:2px;--radius-sm:3px;--radius-md:4px;--radius-pill:999px;
--border-width-hairline:1px;--border-width-strong:2px;
}
:root{
--shadow-none:none;
--shadow-sm:0 1px 2px rgba(0,0,0,.06);
--shadow-md:0 6px 20px rgba(0,0,0,.07);
--shadow-lg:0 24px 60px rgba(0,0,0,.12);
--shadow-focus:0 0 0 2px var(--fri-white),0 0 0 4px var(--focus-ring);
--overlay-scrim:rgba(0,0,0,.62);
--protect-gradient:linear-gradient(180deg,rgba(0,0,0,0) 0%,rgba(0,0,0,.72) 100%);
}
:root{
--dur-instant:80ms;
--dur-fast:140ms;
--dur-base:220ms;
--dur-slow:420ms;
--ease-standard:cubic-bezier(.2,.7,.3,1);
--ease-in:cubic-bezier(.5,0,.9,.4);
--ease-out:cubic-bezier(.1,.6,.2,1);
--transition-control:color var(--dur-fast) var(--ease-standard),background-color var(--dur-fast) var(--ease-standard),border-color var(--dur-fast) var(--ease-standard);
}
*,*::before,*::after{box-sizing:border-box}
body{margin:0;font-family:var(--font-sans);font-size:var(--text-body-md);line-height:var(--lh-body);color:var(--text-body);background:var(--surface-page);-webkit-font-smoothing:antialiased}
h1,h2,h3,h4,h5{font-family:var(--font-display);font-weight:var(--fw-bold);color:var(--text-strong);letter-spacing:var(--ls-heading);line-height:var(--lh-heading);margin:0}
p{margin:0}
a{color:var(--text-link);text-decoration:underline;text-underline-offset:3px;text-decoration-thickness:1px;transition:var(--transition-control)}
a:hover{color:var(--grey-600);text-decoration-thickness:2px}
::selection{background:var(--fri-black);color:var(--fri-white)}
:focus-visible{outline:2px solid var(--focus-ring);outline-offset:2px}
@font-face{font-family:"PP Mori";src:url(../fonts/PPMori-Regular.woff2) format("woff2"),url(../fonts/PPMori-Regular.woff) format("woff");font-weight:100 499;font-style:normal;font-display:swap}
@font-face{font-family:"PP Mori";src:url(../fonts/PPMori-Semibold.woff2) format("woff2"),url(../fonts/PPMori-Semibold.woff) format("woff");font-weight:500 900;font-style:normal;font-display:swap}
