/* OYA — static build. Design tokens + base from OYA Design System. */
/* OYA palette. Base system = nero fumo + avorio. Grigio pietra is the service colour.
   Accent colours exist ONLY as the dot (content taxonomy, sect. 8) — never for text. */
:root{
/* Brand base */
--oya-smoke:#131311;      /* nero fumo — from the master logo artwork */
--oya-ivory:#F4F1EA;      /* avorio — from OYA_logo_ivory.svg */
--oya-stone:#8A877F;      /* grigio pietra — DERIVED, pending confirmation */

/* Ink / stone / sand ladder (derived tints of the two base colours) */
--oya-ink-0:#131311;
--oya-ink-1:#1B1B18;
--oya-ink-2:#24231F;
--oya-ink-3:#302F29;
--oya-ink-4:#4A4842;
--oya-stone-1:#6B6860;
--oya-stone-2:#8A877F;
--oya-stone-3:#ADA9A0;
--oya-sand-1:#CFCAC0;
--oya-sand-2:#E4E0D7;
--oya-sand-3:#EDEAE2;
--oya-ivory-0:#F4F1EA;

/* Dot taxonomy — content categories */
--oya-coral:#D85A30;      /* Release */
--oya-amber:#EF9F27;      /* New signings */
--oya-green:#1D9E75;      /* Live & events */
--oya-violet:#7F77DD;     /* Milestones */

--dot-release:var(--oya-coral);
--dot-new-signings:var(--oya-amber);
--dot-live-events:var(--oya-green);
--dot-milestones:var(--oya-violet);
--dot-corporate:currentColor;

/* Semantic aliases — DEFAULT THEME IS SMOKE (dark) */
--surface-base:var(--oya-smoke);
--surface-raised:var(--oya-ink-1);
--surface-sunken:#0C0C0B;
--surface-card:var(--oya-ink-1);
--surface-inverse:var(--oya-ivory);
--surface-field:var(--oya-ink-2);

--text-primary:var(--oya-ivory);
--text-secondary:var(--oya-stone-3);
--text-muted:var(--oya-stone-1);
--text-inverse:var(--oya-smoke);
--text-on-accent:var(--oya-ivory);

--border-hairline:#2A2924;
--border-default:#38362F;
--border-strong:var(--oya-stone-1);
--border-inverse:var(--oya-ivory);

--focus-ring:var(--oya-ivory);
--overlay-scrim:rgba(19,19,17,0.82);
}

/* Ivory theme — corporate documents, light applications */
.oya-theme-ivory{
--surface-base:var(--oya-ivory);
--surface-raised:#FBF9F4;
--surface-sunken:var(--oya-sand-3);
--surface-card:#FBF9F4;
--surface-inverse:var(--oya-smoke);
--surface-field:#FFFFFF;

--text-primary:var(--oya-smoke);
--text-secondary:var(--oya-ink-4);
--text-muted:var(--oya-stone-1);
--text-inverse:var(--oya-ivory);
--text-on-accent:var(--oya-ivory);

--border-hairline:var(--oya-sand-1);
--border-default:var(--oya-stone-3);
--border-strong:var(--oya-ink-3);
--border-inverse:var(--oya-smoke);

--focus-ring:var(--oya-smoke);
--overlay-scrim:rgba(19,19,17,0.55);
}

/* 4px base grid. X = cap height of the logotype; clear space = 1X (see readme sect. 4.3). */
:root{
--space-0:0;
--space-1:4px;
--space-2:8px;
--space-3:12px;
--space-4:16px;
--space-5:24px;
--space-6:32px;
--space-7:48px;
--space-8:64px;
--space-9:96px;
--space-10:128px;
--space-11:180px;

--gutter-inline:clamp(20px,5vw,72px); /* @kind spacing */
--section-y:clamp(56px,9vw,140px); /* @kind spacing */
--stack-tight:var(--space-2);
--stack:var(--space-4);
--stack-loose:var(--space-6);

--measure-narrow:46ch; /* @kind other */
--measure:64ch; /* @kind other */
--container-max:1320px;
--container-text:760px;

/* Logo geometry (derived from the master artwork, 1080 × 644.98) */
--logo-clearspace:1em;   /* = 1X on every side */
--logo-min-width:96px;   /* below this, switch to the monogram */
--monogram-min:24px;     /* absolute floor — the dot stops reading */
}

/* OYA is a flat, hairline-ruled system: structure comes from 1px rules, not shadows.
   Radii are square by default; only the dot and pills are round. */
:root{
--radius-0:0px;
--radius-sm:2px;
--radius-md:4px;
--radius-pill:999px;
--radius-dot:50%;

--border-width:1px; /* @kind other */
--border-width-strong:2px; /* @kind other */
--rule:var(--border-width) solid var(--border-hairline);
--rule-strong:var(--border-width) solid var(--border-strong);

/* Elevation is used sparingly — overlays only */
--shadow-none:none;
--shadow-overlay:0 24px 64px -16px rgba(0,0,0,0.55);
--shadow-inset-hairline:inset 0 0 0 1px var(--border-hairline);

--blur-scrim:blur(18px); /* @kind other */
--blur-soft:blur(6px); /* @kind other */

--alpha-hover:0.72; /* @kind other */
--alpha-disabled:0.38; /* @kind other */

--ease-standard:cubic-bezier(0.2,0.6,0.2,1); /* @kind other */
--ease-out:cubic-bezier(0.16,1,0.3,1); /* @kind other */
--ease-pulse:cubic-bezier(0.45,0,0.55,1); /* @kind other */
--dur-fast:120ms; /* @kind other */
--dur-base:200ms; /* @kind other */
--dur-slow:420ms; /* @kind other */
--dur-pulse:1600ms; /* @kind other */

--protection-gradient:linear-gradient(to top,rgba(19,19,17,0.92) 0%,rgba(19,19,17,0.6) 42%,rgba(19,19,17,0) 100%); /* @kind other */
}
@keyframes oya-dot-pulse{0%,100%{transform:scale(1);opacity:1}50%{transform:scale(1.18);opacity:.82}}

500;600;700;800&family=Space+Grotesk:wght@300;400;500;600;700&display=swap");
/* OYA type system. Logotype = CS Rodney (licensed, file-only — never a webfont).
   Display = Syne. Text/UI = Space Grotesk. Office fallback = Arial. */
:root{
--font-display:"Syne","Space Grotesk",system-ui,sans-serif; /* @kind font */
--font-text:"Space Grotesk",system-ui,-apple-system,sans-serif; /* @kind font */
--font-office:Arial,Helvetica,sans-serif; /* @kind font */
--font-mono:ui-monospace,SFMono-Regular,Menlo,monospace; /* @kind font */

--fw-light:300; /* @kind font */
--fw-regular:400; /* @kind font */
--fw-medium:500; /* @kind font */
--fw-semibold:600; /* @kind font */
--fw-bold:700; /* @kind font */
--fw-extrabold:800; /* @kind font */

/* Display ladder — Syne, tight tracking, set in uppercase or sentence case */
--fs-display-1:clamp(3.5rem,8vw,7.5rem); /* @kind font */
--fs-display-2:clamp(2.75rem,5.5vw,4.75rem); /* @kind font */
--fs-display-3:clamp(2rem,3.6vw,3rem); /* @kind font */
--fs-heading-1:2rem; /* @kind font */
--fs-heading-2:1.5rem; /* @kind font */
--fs-heading-3:1.125rem; /* @kind font */
/* Text ladder — Space Grotesk */
--fs-body-lg:1.125rem; /* @kind font */
--fs-body:1rem; /* @kind font */
--fs-body-sm:0.875rem; /* @kind font */
--fs-caption:0.8125rem; /* @kind font */
--fs-label:0.6875rem; /* @kind font */

--lh-display:0.92; /* @kind font */
--lh-heading:1.1; /* @kind font */
--lh-body:1.55; /* @kind font */
--lh-tight:1.25; /* @kind font */

--tracking-display:-0.03em; /* @kind font */
--tracking-heading:-0.015em; /* @kind font */
--tracking-body:0em; /* @kind font */
--tracking-label:0.18em; /* @kind font */
--tracking-label-wide:0.28em; /* @kind font */

--text-display-1:var(--fw-extrabold) var(--fs-display-1)/var(--lh-display) var(--font-display); /* @kind font */
--text-display-2:var(--fw-bold) var(--fs-display-2)/var(--lh-display) var(--font-display); /* @kind font */
--text-display-3:var(--fw-bold) var(--fs-display-3)/var(--lh-heading) var(--font-display); /* @kind font */
--text-heading-1:var(--fw-bold) var(--fs-heading-1)/var(--lh-heading) var(--font-display); /* @kind font */
--text-heading-2:var(--fw-semibold) var(--fs-heading-2)/var(--lh-heading) var(--font-display); /* @kind font */
--text-heading-3:var(--fw-medium) var(--fs-heading-3)/var(--lh-tight) var(--font-text); /* @kind font */
--text-body:var(--fw-regular) var(--fs-body)/var(--lh-body) var(--font-text); /* @kind font */
--text-body-sm:var(--fw-regular) var(--fs-body-sm)/var(--lh-body) var(--font-text); /* @kind font */
--text-label:var(--fw-medium) var(--fs-label)/1.2 var(--font-text); /* @kind font */
}

/* Minimal resets + brand defaults. Consumers get these by linking styles.css. */
*,*::before,*::after{box-sizing:border-box}
body{margin:0;background:var(--surface-base);color:var(--text-primary);font:var(--text-body);letter-spacing:var(--tracking-body);-webkit-font-smoothing:antialiased;text-wrap:pretty}
h1,h2,h3,h4{margin:0;font-family:var(--font-display);letter-spacing:var(--tracking-heading);line-height:var(--lh-heading)}
p{margin:0}
a{color:var(--text-primary);text-decoration:none;border-bottom:1px solid var(--border-strong);transition:border-color var(--dur-fast) var(--ease-standard),opacity var(--dur-fast) var(--ease-standard)}
a:hover{border-bottom-color:var(--text-primary)}
a:active{opacity:var(--alpha-hover)}
:focus-visible{outline:2px solid var(--focus-ring);outline-offset:2px}
::selection{background:var(--oya-coral);color:var(--oya-ivory)}
.oya-eyebrow{font:var(--text-label);text-transform:uppercase;letter-spacing:var(--tracking-label);color:var(--text-secondary)}

body{margin:0;background:#131311;color:#F4F1EA;font-family:"Space Grotesk",system-ui,sans-serif;-webkit-font-smoothing:antialiased}
a{text-decoration:none}
@keyframes oya-dot-pulse{0%,100%{transform:scale(1);opacity:1}50%{transform:scale(1.18);opacity:.82}}
[hidden]{display:none !important}
@media (max-width:1039.98px){.only-desktop{display:none !important}}
@media (min-width:1040px){.only-mobile{display:none !important}}
@media (prefers-reduced-motion:reduce){*{animation:none !important}}
.hv1:hover{filter:grayscale(0.35) contrast(1.04) brightness(1) !important}
.hv2:hover{filter:grayscale(0.35) contrast(1.04) brightness(1) !important}
.hv3:hover{filter:grayscale(0.35) contrast(1.04) brightness(1) !important}
.hv4:hover{filter:grayscale(0.35) contrast(1.04) brightness(1) !important}
.hv5:hover{color:#F4F1EA !important}
.hv6:hover{color:#F4F1EA !important}
.hv7:hover{color:#F4F1EA !important}
.hv8:hover{background:#38362F !important}

.hv-sp:hover{border-color:#6B6860 !important}