:root{
--color-bg:#0d0d0f;
--color-surface:#1a1614;
--color-accent:#d4af37;
--color-accent-hover:#c7a233;
--color-text:#fffff8;
--color-border:rgba(212,175,55,0.18);

--font-heading:"Playfair Display",serif;
--font-body:"Inter",sans-serif;

--fs-1:clamp(2rem,3vw,2.8rem);
--fs-2:clamp(1.7rem,2.5vw,2.2rem);
--fs-3:clamp(1.3rem,2vw,1.6rem);
--fs-4:1.2rem;
--fs-5:1rem;
--fs-6:0.95rem;

--space-0:0;
--space-1:8px;
--space-2:16px;
--space-3:24px;
--space-4:32px;
--space-5:48px;
--space-6:64px;

--radius:8px;

--container-max:1200px;
--container-pad:32px;

--shadow-soft:0 2px 12px rgba(0,0,0,0.11);

--transition-fast:120ms ease;
}

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

html{
font-size:16px;
-webkit-text-size-adjust:100%;
}

body{
background:var(--color-bg);
color:var(--color-text);
font-family:var(--font-body);
line-height:1.6;
min-height:100vh;
text-rendering:optimizeLegibility;
}

img,
picture,
video,
canvas,
svg{
display:block;
max-width:100%;
height:auto;
border-radius:var(--radius);
}

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

a:hover,
a:focus{
color:var(--color-accent-hover);
}

ul{
list-style:none !important;
padding-left:0;
}

button,
input,
textarea,
select{
font:inherit;
color:inherit;
background:none;
border:none;
outline:none;
}

button{
cursor:pointer;
}

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

h1,h2,h3,h4,h5,h6{
font-family:var(--font-heading);
text-transform:uppercase;
letter-spacing:0.04em;
line-height:1.2;
margin-bottom:var(--space-3);
overflow-wrap:anywhere;
}

h1{font-size:var(--fs-1);}
h2{font-size:var(--fs-2);}
h3{font-size:var(--fs-3);}
h4{font-size:var(--fs-4);}
h5{font-size:var(--fs-5);}
h6{font-size:var(--fs-6);}

p{
font-size:var(--fs-5);
margin-bottom:var(--space-3);
}

small{
font-size:var(--fs-6);
}

blockquote{
margin-bottom:var(--space-3);
padding-left:var(--space-3);
border-left:1px solid var(--color-border);
}

.container{
width:100%;
max-width:var(--container-max);
margin-left:auto;
margin-right:auto;
padding-left:var(--container-pad);
padding-right:var(--container-pad);
}

.section{
padding-top:var(--space-5);
padding-bottom:var(--space-5);
}

.surface{
background:var(--color-surface);
border:1px solid var(--color-border);
border-radius:var(--radius);
}

.card{
background:var(--color-surface);
border:1px solid var(--color-border);
border-radius:var(--radius);
padding:var(--space-3);
min-width:0;
overflow:visible;
}

.card > *:last-child{
margin-bottom:0;
}

.card h3,
.card h2{
overflow-wrap:anywhere;
max-width:100%;
}

.btn{
display:inline-flex;
align-items:center;
justify-content:center;
gap:8px;
padding:12px 20px;
border-radius:var(--radius);
font-size:0.95rem;
text-transform:uppercase;
letter-spacing:0.05em;
transition:all var(--transition-fast);
min-width:fit-content;
}

.btn-primary{
background:var(--color-accent);
color:#0d0d0f;
}

.btn-primary:hover,
.btn-primary:focus{
background:var(--color-accent-hover);
}

.btn-secondary{
border:1px solid var(--color-accent);
color:var(--color-accent);
}

.btn-secondary:hover,
.btn-secondary:focus{
background:var(--color-accent);
color:#0d0d0f;
}

.input,
textarea,
select{
width:100%;
padding:12px 14px;
background:var(--color-surface);
border:1px solid var(--color-border);
border-radius:var(--radius);
color:var(--color-text);
}

.input::placeholder,
textarea::placeholder{
color:rgba(255,255,248,0.6);
}

.input:focus,
textarea:focus,
select:focus{
border-color:var(--color-accent);
}

label{
display:block;
margin-bottom:var(--space-1);
font-size:var(--fs-6);
}

form > *:not(:last-child){
margin-bottom:var(--space-3);
}

.nav-toggle{
display:flex;
flex-direction:column;
gap:5px;
}

.hr{
height:1px;
background:var(--color-border);
border:none;
margin:var(--space-4) 0;
}

.media-overlay{
position:relative;
overflow:hidden;
border-radius:var(--radius);
}

.media-overlay::after{
content:"";
position:absolute;
inset:0;
background:linear-gradient(to bottom,rgba(13,13,15,0.2),rgba(13,13,15,0.8));
}

@media (max-width:768px){
:root{
--container-pad:16px;
}

.section{
padding-top:var(--space-4);
padding-bottom:var(--space-4);
}

p{
font-size:var(--fs-6);
}
}
html, body {
  overflow-x: clip;
  max-width: 100%;
}

img, video, svg {
  max-width: 100%;
  height: auto;
}
