:root{
  --bg:#070707;
  --bg-soft:#0f0f10;
  --panel:#111113;
  --line:rgba(223,179,145,.24);
  --line-soft:rgba(255,255,255,.08);
  --text:#f4efe9;
  --muted:#d3c3b4;
  --accent:#cc986f;
  --accent-2:#ddb392;
  --shadow:0 28px 72px rgba(0,0,0,.48);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  font-family:'Inter',sans-serif;
  color:var(--text);
  background:
    radial-gradient(circle at top left, rgba(204,152,111,.10), transparent 34%),
    linear-gradient(180deg,#090909 0%,#050505 100%);
}
img{max-width:100%;display:block}
a{text-decoration:none;color:inherit}
.wrap{width:min(1260px, calc(100% - 48px));margin:0 auto}

.site-header{
  position:sticky; top:0; z-index:50;
  backdrop-filter:blur(14px);
  background:rgba(7,7,7,.82);
  border-bottom:1px solid rgba(255,255,255,.06);
}
.nav-row{
  min-height:88px;
  display:flex; align-items:center; justify-content:space-between; gap:28px;
}
.brand{display:flex; flex-direction:column; gap:5px}
.brand-main,.footer-brand{
  font-size:2rem; font-weight:900; letter-spacing:.05em;
}
.brand-main span,.footer-brand span{color:var(--accent)}
.brand-sub{
  font-size:.7rem; letter-spacing:.22em; text-transform:uppercase; color:#dbc8b8;
}
.nav{
  display:flex; gap:26px; align-items:center;
}
.nav a{
  font-size:.78rem; font-weight:800; text-transform:uppercase; letter-spacing:.12em;
}
.nav a:hover{color:var(--accent)}

.button{
  display:inline-flex; align-items:center; justify-content:center;
  min-height:52px; padding:0 24px;
  border:1px solid var(--accent);
  text-transform:uppercase; letter-spacing:.13em; font-size:.78rem; font-weight:800;
  transition:.2s ease;
}
.button:hover{transform:translateY(-1px)}
.button-fill{background:var(--accent); color:#130f0c}
.button-fill:hover{background:var(--accent-2)}
.button-outline:hover{background:rgba(204,152,111,.08)}

.hero{padding:22px 0 14px}
.hero-grid{
  display:grid; grid-template-columns:1.04fr .96fr; gap:34px; align-items:stretch;
}
.hero-copy{
  padding:86px 0 18px;
}
.eyebrow,.section-label{
  margin:0 0 18px;
  text-transform:uppercase; letter-spacing:.24em; font-size:.8rem; color:#d9c5b4;
}
.hero h1,.packages h2,.portfolio h2,.contact h2{
  margin:0 0 18px;
  font-family:'Cormorant Garamond',serif;
  line-height:.88;
}
.hero h1{
  font-size:clamp(4.5rem, 7.6vw, 7rem);
  max-width:8ch;
}
.hero h1 span{
  color:var(--accent); font-style:italic; font-weight:600;
}
.hero-text{
  max-width:58ch; margin:0 0 28px;
  color:var(--muted); line-height:1.8; font-size:1.05rem;
}
.hero-actions{display:flex; gap:16px; flex-wrap:wrap; margin-bottom:30px}
.hero-highlights{
  display:grid; grid-template-columns:repeat(4,1fr); gap:16px;
}
.highlight{
  display:flex; align-items:center; gap:12px;
  padding:14px 0; border-top:1px solid rgba(255,255,255,.08);
}
.highlight .icon{
  width:34px; height:34px; display:grid; place-items:center;
  color:var(--accent); font-size:1.35rem; flex:0 0 auto;
}
.highlight strong, .highlight small{display:block}
.highlight strong{font-size:.95rem}
.highlight small{color:var(--muted); margin-top:3px}

.hero-visual{
  position:relative; min-height:760px; overflow:hidden; border-radius:28px;
  background:#111; border:1px solid rgba(255,255,255,.06); box-shadow:var(--shadow);
}
.hero-visual::after{
  content:""; position:absolute; inset:0;
  background:linear-gradient(180deg,rgba(0,0,0,.05) 0%,rgba(0,0,0,.18) 48%,rgba(0,0,0,.55) 100%);
}
.hero-visual img{
  width:100%; height:100%; object-fit:cover; object-position:center center;
}
.hero-card{
  position:absolute; right:22px; top:126px; z-index:2; width:min(320px, calc(100% - 44px));
  background:rgba(15,15,17,.92); border:1px solid var(--line);
  padding:22px; border-radius:0; box-shadow:var(--shadow);
}
.signature{
  margin:0 0 8px; color:var(--accent);
  font-size:2rem; font-style:italic; font-family:'Cormorant Garamond',serif;
}
.hero-card-title{
  margin:0 0 12px; font-size:.78rem; font-weight:800; letter-spacing:.14em; text-transform:uppercase;
}
.hero-card-copy{margin:0 0 14px; color:var(--muted); line-height:1.7}
.hero-card a{color:var(--accent); font-weight:700}
.hero-monogram,.contact-monogram{
  display:grid; place-items:center; width:96px; height:96px; border-radius:50%;
  border:2px solid var(--accent); color:var(--text);
  font-family:'Cormorant Garamond',serif; font-size:3rem; line-height:1;
}
.hero-monogram span,.contact-monogram span{color:var(--accent)}
.hero-monogram{
  position:absolute; right:26px; bottom:26px; z-index:2;
}

.section{padding:72px 0}
.packages h2,.portfolio h2,.contact h2{
  font-size:clamp(2.6rem, 4vw, 4.2rem);
}
.section-head{
  display:flex; justify-content:space-between; gap:24px; align-items:end; margin-bottom:24px;
}
.package-grid{
  display:grid; grid-template-columns:repeat(5,1fr); gap:18px;
}
.package-card{
  min-height:208px;
  padding:24px; border:1px solid var(--line); background:linear-gradient(180deg,#0d0d0f,#121215);
  box-shadow:var(--shadow);
}
.package-card h3{margin:0 0 12px; font-size:1.06rem; line-height:1.35}
.package-card p{margin:0 0 18px; color:var(--muted); line-height:1.75}
.package-card strong{color:var(--accent); letter-spacing:.03em}
.benefits{
  margin-top:18px; display:grid; grid-template-columns:repeat(4,1fr); gap:18px;
}
.benefits div{
  padding:18px 0 0; border-top:1px solid rgba(255,255,255,.08);
}
.benefits h4{margin:0 0 8px; color:var(--text)}
.benefits p{margin:0; color:var(--muted); line-height:1.7}

.portfolio-grid{
  display:grid; grid-template-columns:repeat(6,1fr); gap:10px;
}
.portfolio-card{
  position:relative; min-height:188px; overflow:hidden; background:#111;
  border:1px solid rgba(255,255,255,.07);
}
.portfolio-card img{
  width:100%; height:100%; object-fit:cover;
}
.portfolio-overlay{
  position:absolute; inset:auto 0 0 0; padding:14px;
  background:linear-gradient(180deg,transparent,rgba(0,0,0,.82));
}
.portfolio-overlay h3{margin:0 0 5px; font-size:1rem}
.portfolio-overlay p{margin:0; color:#e1d6cc; font-size:.88rem; line-height:1.45}
.center-row{display:flex; justify-content:center; margin-top:20px}

.testimonial-grid{
  display:grid; grid-template-columns:repeat(3,1fr); gap:14px;
}
blockquote{
  margin:0; padding:24px; border:1px solid var(--line); background:#0d0d10;
}
blockquote p{margin:0 0 16px; color:#eee7df; line-height:1.8}
blockquote footer{color:var(--accent)}

.contact-grid{
  display:grid; grid-template-columns:.9fr 1.1fr; gap:34px; align-items:start;
}
.contact-list{list-style:none; margin:22px 0 26px; padding:0}
.contact-list li{margin:0 0 12px; color:var(--muted); line-height:1.7}
.contact-form{
  padding:22px; border:1px solid var(--line); background:#0d0d10;
}
.form-row{display:grid; grid-template-columns:1fr 1fr; gap:14px}
input,textarea{
  width:100%; margin:0 0 14px; padding:16px 18px;
  border:1px solid var(--line); background:#0a0a0c; color:var(--text); font:inherit;
}
input::placeholder,textarea::placeholder{color:#a8998e}
.submit-button{width:100%}

.site-footer{
  border-top:1px solid rgba(255,255,255,.06); padding:26px 0 38px;
}
.footer-row{
  display:flex; justify-content:space-between; align-items:center; gap:24px;
}
.footer-row p{margin:0; color:#c8b8aa}

@media (max-width: 1180px){
  .hero-grid,.package-grid,.benefits,.portfolio-grid,.contact-grid,.hero-highlights,.testimonial-grid{
    grid-template-columns:1fr 1fr;
  }
  .portfolio-grid{grid-template-columns:repeat(3,1fr)}
  .package-card:last-child{grid-column:span 2}
  .hero-visual{min-height:620px}
}
@media (max-width: 820px){
  .nav-row{flex-wrap:wrap; padding:14px 0}
  .nav{width:100%; justify-content:center; flex-wrap:wrap; gap:18px}
  .hero-grid,.package-grid,.benefits,.portfolio-grid,.contact-grid,.hero-highlights,.testimonial-grid,.form-row{
    grid-template-columns:1fr;
  }
  .hero-copy{padding-top:28px}
  .hero h1{font-size:4.2rem}
  .hero-card{top:auto; bottom:24px}
  .hero-monogram{display:none}
  .package-card:last-child{grid-column:auto}
  .section-head,.footer-row{flex-direction:column; align-items:start}
  .nav-cta{display:none}
}