@font-face{font-family:'Manrope';font-style:normal;font-weight:400;font-display:swap;src:url('fonts/manrope-latin-400-normal.woff2') format('woff2');}
@font-face{font-family:'Manrope';font-style:normal;font-weight:500;font-display:swap;src:url('fonts/manrope-latin-500-normal.woff2') format('woff2');}
@font-face{font-family:'Manrope';font-style:normal;font-weight:600;font-display:swap;src:url('fonts/manrope-latin-600-normal.woff2') format('woff2');}
@font-face{font-family:'Manrope';font-style:normal;font-weight:700;font-display:swap;src:url('fonts/manrope-latin-700-normal.woff2') format('woff2');}
@font-face{font-family:'Manrope';font-style:normal;font-weight:800;font-display:swap;src:url('fonts/manrope-latin-800-normal.woff2') format('woff2');}
@font-face{font-family:'IBM Plex Mono';font-style:normal;font-weight:400;font-display:swap;src:url('fonts/ibm-plex-mono-latin-400-normal.woff2') format('woff2');}
@font-face{font-family:'IBM Plex Mono';font-style:normal;font-weight:500;font-display:swap;src:url('fonts/ibm-plex-mono-latin-500-normal.woff2') format('woff2');}
@font-face{font-family:'IBM Plex Mono';font-style:normal;font-weight:600;font-display:swap;src:url('fonts/ibm-plex-mono-latin-600-normal.woff2') format('woff2');}
@font-face{font-family:'IBM Plex Sans Arabic';font-style:normal;font-weight:400;font-display:swap;src:url('fonts/ibm-plex-sans-arabic-arabic-400-normal.woff2') format('woff2');}
@font-face{font-family:'IBM Plex Sans Arabic';font-style:normal;font-weight:500;font-display:swap;src:url('fonts/ibm-plex-sans-arabic-arabic-500-normal.woff2') format('woff2');}
@font-face{font-family:'IBM Plex Sans Arabic';font-style:normal;font-weight:600;font-display:swap;src:url('fonts/ibm-plex-sans-arabic-arabic-600-normal.woff2') format('woff2');}
@font-face{font-family:'IBM Plex Sans Arabic';font-style:normal;font-weight:700;font-display:swap;src:url('fonts/ibm-plex-sans-arabic-arabic-700-normal.woff2') format('woff2');}
@font-face{font-family:'Bricolage Grotesque';font-style:normal;font-weight:400;font-display:swap;src:url('fonts/bricolage-grotesque-latin-400-normal.woff2') format('woff2');}
@font-face{font-family:'Bricolage Grotesque';font-style:normal;font-weight:700;font-display:swap;src:url('fonts/bricolage-grotesque-latin-700-normal.woff2') format('woff2');}
@font-face{font-family:'Bricolage Grotesque';font-style:normal;font-weight:800;font-display:swap;src:url('fonts/bricolage-grotesque-latin-800-normal.woff2') format('woff2');}
@font-face{font-family:'Instrument Serif';font-style:normal;font-weight:400;font-display:swap;src:url('fonts/instrument-serif-latin-400-normal.woff2') format('woff2');}
@font-face{font-family:'Instrument Serif';font-style:italic;font-weight:400;font-display:swap;src:url('fonts/instrument-serif-latin-400-italic.woff2') format('woff2');}

:root{
/* Brand primitives — exact source hex from supplied logo files */
--bab-teal:#008080;
--bab-teal-600:#00696b;
--bab-teal-300:#4fb3ac;
--bab-teal-100:#d7ece9;
--bab-navy:#0f2230;
--bab-navy-700:#152c3d;
--bab-navy-500:#1f3a4d;
--bab-navy-300:#5b7080;
--bab-white:#ffffff;
--bab-off-white:#f4f6f5;
--bab-friction-red:#c1442d;
--bab-friction-red-100:#f6e1dc;
--bab-success:#2f8f5b;
--bab-warning:#c98a2c;
/* extended editorial palette — colour-blocked sections, drawn from the concept work */
--paper:#f2ece1;
--paper-ink:#141b21;
--paper-dim:#5d6a72;
--saffron:#e8b422;
--terracotta:#c8563a;

/* Canvas / surfaces — dark editorial foundation */
--canvas-primary:var(--bab-navy);
--canvas-raised:var(--bab-navy-700);
--surface-primary:#152a3a;
--surface-interactive:#1c3547;
--surface-card:#132633;

/* Text */
--text-primary:var(--bab-off-white);
--text-secondary:#a9b8c2;
--text-inverse:var(--bab-navy);
--text-on-light-secondary:#4c5b66;

/* Borders */
--border-subtle:rgba(255,255,255,0.10);
--border-strong:rgba(255,255,255,0.24);
--border-on-light:rgba(15,34,48,0.14);

/* Brand roles */
--brand-primary:var(--bab-teal);
--brand-secondary:var(--bab-navy);
--action-primary:var(--bab-teal);
--action-primary-hover:#00979a;
--action-primary-pressed:var(--bab-teal-600);
--friction:var(--bab-friction-red);
--success:var(--bab-success);
--warning:var(--bab-warning);
--error:var(--bab-friction-red);
--focus-ring:#5fd0cf;

/* Interactive states */
--state-disabled-bg:rgba(255,255,255,0.06);
--state-disabled-text:rgba(255,255,255,0.32);
--state-hover-overlay:rgba(255,255,255,0.06);
--state-pressed-overlay:rgba(0,0,0,0.14);
--state-selected-bg:rgba(0,128,128,0.16);
}

:root{
--font-display:'Bricolage Grotesque','Manrope',-apple-system,sans-serif;
--font-accent:'Instrument Serif',Georgia,serif;
--font-body:'Manrope',-apple-system,sans-serif;
--font-arabic:'IBM Plex Sans Arabic','Manrope',sans-serif;
--font-mono:'IBM Plex Mono',ui-monospace,monospace;

--text-display:clamp(2.75rem,6vw,5.25rem);
--text-h1:clamp(2.25rem,4.4vw,3.75rem);
--text-h2:clamp(1.75rem,3vw,2.5rem);
--text-h3:clamp(1.375rem,2vw,1.75rem);
--text-body-lg:clamp(1.125rem,1.4vw,1.3rem);
--text-body:1rem;
--text-label:0.875rem;
--text-caption:0.75rem;
--text-utility:0.8125rem;

--leading-tight:1.08;
--leading-snug:1.25;
--leading-normal:1.5;
--leading-relaxed:1.65;

--weight-regular:400;
--weight-medium:500;
--weight-semibold:600;
--weight-bold:700;
--weight-extrabold:800;

--tracking-tight:-0.01em;
--tracking-normal:0em;
--tracking-wide:0.04em;
--tracking-label:0.08em;
}

:root{
--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;--space-48:192px;

--radius-none:0px;--radius-sm:4px;--radius-md:8px;--radius-full:999px;

--border-thin:1px;--border-thick:2px;

--shadow-none:none;
--shadow-perimeter:0 0 120px 0 rgba(0,128,128,0.18);
--shadow-focus:0 0 0 3px var(--focus-ring);
--shadow-card:0 1px 0 0 var(--border-subtle);

--z-base:0; /* @kind other */
--z-raised:10; /* @kind other */
--z-nav:100; /* @kind other */
--z-overlay:200; /* @kind other */
--z-toast:300; /* @kind other */

--container-max:1280px;
--container-narrow:760px;
--grid-columns:12; /* @kind other */
--grid-gutter:24px;

--motion-instant:100ms; /* @kind other */
--motion-component:200ms; /* @kind other */
--motion-section:420ms; /* @kind other */
--motion-signature:1400ms; /* @kind other */
--motion-stagger:60ms; /* @kind other */
--ease-standard:cubic-bezier(.4,0,.2,1); /* @kind other */
--ease-out:cubic-bezier(0,0,.2,1); /* @kind other */
}