/* ======================================
BASE.CSS
Foundation Layer
====================================== */

/* GOOGLE FONTS — Inter */

*,
*::before,
*::after{
margin:0;
padding:0;
box-sizing:border-box;
}

/* DESIGN TOKENS */

:root{

/* Brand Colours */
--color-primary:#0b1e3c;
--color-primary-deep:#07152b;
--color-accent:#c9a227;
--color-accent-light:#e8c456;
--color-accent-glow:rgba(201,162,39,.25);

/* Surface Colours */
--color-text:#1a1a2e;
--color-text-secondary:#4a5568;
--color-muted:#718096;
--color-light:#f8f7f4;
--color-light-alt:#f0efe9;
--color-white:#ffffff;
--color-border:#e8e4dc;

/* Gradients */
--gradient-hero:linear-gradient(160deg, #0b1e3c 0%, #12335a 55%, #0f2847 100%);
--gradient-accent:linear-gradient(135deg, #c9a227 0%, #e8c456 100%);
--gradient-card:linear-gradient(145deg, #ffffff 0%, #faf9f6 100%);

/* Typography */
--font-base:'Segoe UI', system-ui, -apple-system, BlinkMacSystemFont, 'Helvetica Neue', Arial, sans-serif;

/* Font Sizes */
--text-xs:0.75rem;
--text-sm:0.875rem;
--text-base:1rem;
--text-lg:1.125rem;
--text-xl:1.25rem;
--text-2xl:1.5rem;
--text-3xl:1.875rem;
--text-4xl:2.25rem;
--text-5xl:2.75rem;

/* Spacing */
--space-xs:4px;
--space-sm:8px;
--space-md:16px;
--space-lg:32px;
--space-xl:60px;
--space-2xl:90px;

/* Radius */
--radius-sm:4px;
--radius-md:8px;
--radius-lg:16px;
--radius-xl:24px;

/* Shadows */
--shadow-sm:0 1px 3px rgba(0,0,0,.06), 0 1px 2px rgba(0,0,0,.04);
--shadow-md:0 4px 16px rgba(0,0,0,.08), 0 2px 6px rgba(0,0,0,.05);
--shadow-lg:0 12px 32px rgba(0,0,0,.10), 0 4px 12px rgba(0,0,0,.06);
--shadow-xl:0 24px 56px rgba(0,0,0,.12), 0 8px 20px rgba(0,0,0,.07);
--shadow-accent:0 8px 24px rgba(201,162,39,.20);

/* Transitions */
--transition-fast:.18s cubic-bezier(.4,0,.2,1);
--transition-base:.28s cubic-bezier(.4,0,.2,1);
--transition-slow:.45s cubic-bezier(.4,0,.2,1);

}

/* HTML */

html{
scroll-behavior:smooth;
}

/* BODY */

body{
font-family:var(--font-base);
font-size:var(--text-base);
line-height:1.65;
color:var(--color-text);
background:var(--color-white);
-webkit-font-smoothing:antialiased;
-moz-osx-font-smoothing:grayscale;
}

/* TYPOGRAPHY */

h1,h2,h3,h4,h5,h6{
font-weight:700;
color:var(--color-primary);
margin-bottom:var(--space-md);
line-height:1.25;
letter-spacing:-0.02em;
}

h1{font-size:var(--text-5xl);}
h2{font-size:var(--text-3xl);}
h3{font-size:var(--text-2xl);}
h4{font-size:var(--text-xl); font-weight:600;}

p{
margin-bottom:var(--space-md);
color:var(--color-text-secondary);
line-height:1.75;
}

small{
font-size:var(--text-sm);
color:var(--color-muted);
}

/* LINKS */

a{
color:var(--color-primary);
text-decoration:none;
transition:var(--transition-fast);
}

a:hover{
opacity:.8;
}

/* LISTS */

ul,ol{
list-style:none;
}

/* MEDIA */

img{
max-width:100%;
display:block;
}

video{
max-width:100%;
}

/* BUTTON RESET */

button{
border:none;
cursor:pointer;
font-family:inherit;
transition:var(--transition-base);
}

/* ACCESSIBILITY */

:focus-visible{
outline:2px solid var(--color-accent);
outline-offset:3px;
border-radius:var(--radius-sm);
}

:focus:not(:focus-visible){
outline:none;
}

/* TEXT SELECTION */

::selection{
background:var(--color-accent);
color:var(--color-white);
}


.text-center{
text-align:center;
}

.mt-20{
margin-top:20px;
}

.mt-40{
margin-top:40px;
}
