:root{
  --bg:#0a0908;
  --bg-2:#11100f;
  --panel:#161412;
  --panel-soft:#1b1816;
  --text:#f2eee8;
  --muted:#c7bdb0;
  --sand:#d7b589;
  --clay:#ad6a43;
  --moss:#6c7a58;
  --plum:#5f445f;
  --line:rgba(255,244,230,.12);
  --line-strong:rgba(255,244,230,.22);
  --shadow:0 22px 60px rgba(0,0,0,.42);
  --radius:22px;
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
html,body{height:100%}
body{
  margin:0;
  color:var(--text);
  font-family:Inter,ui-sans-serif,system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial,sans-serif;
  background:
    radial-gradient(1000px 560px at 0% 0%, rgba(173,106,67,.18), transparent 58%),
    radial-gradient(900px 600px at 100% 10%, rgba(95,68,95,.2), transparent 56%),
    linear-gradient(180deg, #090807 0%, #0c0b0a 55%, #090807 100%);
}

a{color:inherit}
img{max-width:100%;display:block}
.wrap{max-width:1180px;margin:0 auto;padding:0 24px}

.site-header{
  position:sticky;top:0;z-index:50;
  background:rgba(10,9,8,.76);
  backdrop-filter:blur(14px);
  border-bottom:1px solid var(--line);
}
.header-inner{display:flex;align-items:center;justify-content:space-between;padding:14px 0;gap:24px}
.brand{display:flex;align-items:center;gap:12px;text-decoration:none;min-width:0}
.mark{
  width:36px;height:36px;border-radius:12px;display:grid;place-items:center;
  background:linear-gradient(135deg, rgba(215,181,137,.2), rgba(173,106,67,.2));
  border:1px solid var(--line);
  box-shadow:0 10px 24px rgba(0,0,0,.28);
}
.brand-text{display:flex;flex-direction:column;line-height:1.04;min-width:0}
.brand-name{font-weight:800;letter-spacing:.2px}
.brand-sub{font-size:12px;color:var(--muted)}

.nav{display:flex;align-items:center;gap:18px;flex-wrap:wrap}
.nav a{color:var(--muted);text-decoration:none;font-weight:700;font-size:14px}
.nav a:hover{color:var(--text)}

.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:8px;
  padding:11px 16px;border-radius:999px;text-decoration:none;font-weight:800;
  border:1px solid var(--line);transition:transform .18s ease, background .18s ease, border-color .18s ease;
}
.btn:hover{transform:translateY(-1px)}
.btn-primary{
  color:#140f0b;
  background:linear-gradient(135deg, var(--sand), #f0d4af);
  border-color:rgba(240,212,175,.5);
  box-shadow:0 14px 30px rgba(215,181,137,.18);
}
.btn-ghost{background:rgba(255,255,255,.03)}
.btn-ghost:hover{background:rgba(255,255,255,.06)}

.hero{padding:72px 0 34px}
.hero-split{display:grid;grid-template-columns:1.02fr .98fr;gap:34px;align-items:center}
.eyebrow{margin:0 0 12px;color:var(--muted);font-weight:800;letter-spacing:.16em;text-transform:uppercase;font-size:12px}
h1{font-family:Georgia, 'Times New Roman', serif;font-size:62px;line-height:.97;letter-spacing:-.03em;margin:0 0 18px;max-width:11ch}
h2{font-family:Georgia, 'Times New Roman', serif;font-size:40px;line-height:1.02;letter-spacing:-.03em;margin:0 0 12px}
h3{margin:0 0 10px}
.lede,.muted{color:var(--muted);line-height:1.68}
.lede{font-size:18px;max-width:60ch}
.cta-row{display:flex;gap:12px;flex-wrap:wrap;margin:24px 0 18px}
.proof{display:flex;gap:12px;flex-wrap:wrap;margin:0;padding:0;list-style:none;color:var(--muted);font-size:14px;font-weight:700}
.proof li{padding:9px 12px;border:1px solid var(--line);border-radius:999px;background:rgba(255,255,255,.02)}
.proof-wide li{background:rgba(255,255,255,.03)}

.mosaic-stage{display:grid;gap:16px}
.mosaic-frame{
  display:grid;grid-template-columns:repeat(4,1fr);gap:10px;padding:18px;
  background:linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,.02));
  border:1px solid var(--line-strong);border-radius:30px;box-shadow:var(--shadow);min-height:480px;
}
.tile{display:block;border-radius:18px;min-height:96px;border:1px solid rgba(255,255,255,.08);box-shadow:inset 0 1px 0 rgba(255,255,255,.08), 0 10px 24px rgba(0,0,0,.16)}
.tone-1{background:linear-gradient(135deg,#8d5e40,#e0b98f)}
.tone-2{background:linear-gradient(135deg,#3f4f5f,#93adbb)}
.tone-3{background:linear-gradient(135deg,#304338,#7f967a)}
.tone-4{background:linear-gradient(135deg,#5f445f,#cfadc7)}
.tone-5{background:linear-gradient(135deg,#d6a05c,#f4d39b)}
.tone-6{background:linear-gradient(135deg,#6c6e73,#c7c9cf)}
.tone-7{background:linear-gradient(135deg,#523224,#b47a56)}
.tone-8{background:linear-gradient(135deg,#1c3854,#7197bc)}
.tone-9{background:linear-gradient(135deg,#5f7051,#b8cba7)}
.tone-10{background:linear-gradient(135deg,#8b5160,#d6a2b1)}
.tone-11{background:linear-gradient(135deg,#4b4e39,#afb88b)}
.tone-12{background:linear-gradient(135deg,#8f7b69,#e0d1bc)}
.tone-13{background:linear-gradient(135deg,#2b2a30,#7d7c87)}
.tone-14{background:linear-gradient(135deg,#7a5830,#d8b17f)}
.tone-15{background:linear-gradient(135deg,#566155,#afbcad)}
.tone-16{background:linear-gradient(135deg,#514044,#c39ca6)}
.stage-note{display:flex;gap:10px;flex-wrap:wrap}
.stage-note span{padding:9px 12px;border-radius:999px;border:1px solid var(--line);background:rgba(255,255,255,.02);color:var(--muted);font-size:13px;font-weight:700}

.section{padding:64px 0}
.section.alt{background:linear-gradient(180deg, rgba(255,255,255,.025), rgba(255,255,255,0));border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.section-head{display:flex;align-items:end;justify-content:space-between;gap:20px;margin-bottom:22px}
.section-copy{max-width:54ch}

.quick-links{padding-top:18px}
.quick-links-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:12px}
.quick-link{padding:16px 18px;border-radius:18px;border:1px solid var(--line);text-decoration:none;font-weight:800;background:rgba(255,255,255,.02);text-align:center}
.quick-link:hover{background:rgba(255,255,255,.05)}

.collection-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:16px}
.collection-card{
  min-height:280px;display:flex;flex-direction:column;justify-content:space-between;gap:20px;
  padding:22px;border-radius:24px;border:1px solid var(--line-strong);box-shadow:var(--shadow);
  background:linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,.02));
}
.collection-card h3{font-family:Georgia, 'Times New Roman', serif;font-size:28px;line-height:1}
.collection-card p{margin:0;color:rgba(242,238,232,.86);line-height:1.6}
.collection-card ul{margin:0;padding-left:18px;color:var(--muted);display:grid;gap:6px}
.collection-card a{font-weight:800;text-decoration:none}
.collection-tag{font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:rgba(255,255,255,.76);font-weight:800;margin-bottom:10px!important}
.collection-amber{background:linear-gradient(135deg, rgba(173,106,67,.36), rgba(29,21,16,.92))}
.collection-stone{background:linear-gradient(135deg, rgba(95,98,104,.4), rgba(21,21,21,.94))}
.collection-forest{background:linear-gradient(135deg, rgba(76,98,67,.38), rgba(16,20,16,.94))}
.collection-plum{background:linear-gradient(135deg, rgba(95,68,95,.42), rgba(20,15,22,.94))}

.product-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:16px}
.product-card{overflow:hidden;border-radius:24px;border:1px solid var(--line);background:rgba(255,255,255,.025);box-shadow:var(--shadow)}
.product-art{height:250px;background-size:cover;background-position:center}
.art-sunrise{background:radial-gradient(circle at 30% 30%, rgba(245,208,146,.9), transparent 24%),linear-gradient(135deg,#7f4d2d,#d9a874 45%,#6b3821)}
.art-ocean{background:radial-gradient(circle at 60% 35%, rgba(206,231,255,.85), transparent 18%),linear-gradient(135deg,#16314d,#4e7ea2 48%,#98bfd8)}
.art-forest{background:radial-gradient(circle at 30% 30%, rgba(207,214,170,.75), transparent 18%),linear-gradient(135deg,#32422c,#69805f 45%,#b3c099)}
.art-midnight{background:radial-gradient(circle at 50% 30%, rgba(194,153,195,.7), transparent 20%),linear-gradient(135deg,#18161c,#433348 48%,#7a657e)}
.product-meta{padding:18px 18px 20px}
.product-type{margin:0 0 8px;font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);font-weight:800}
.product-meta h3{font-family:Georgia, 'Times New Roman', serif;font-size:29px;line-height:1;margin-bottom:8px}
.product-meta p{margin:0;color:var(--muted);line-height:1.65}
.product-specs{display:flex;justify-content:space-between;gap:10px;flex-wrap:wrap;margin-top:16px;color:#efe0ca;font-size:14px;font-weight:800}

.split-band{display:grid;grid-template-columns:1fr 1fr;gap:26px;align-items:start}
.detail-list{display:grid;gap:14px}
.detail-list > div{padding:18px;border-radius:18px;border:1px solid var(--line);background:rgba(255,255,255,.025)}
.detail-list p{margin:0;color:var(--muted)}

.timeline{display:grid;gap:14px}
.timeline-clean .step{background:rgba(255,255,255,.025)}
.step{display:flex;gap:14px;align-items:flex-start;padding:18px;border:1px solid var(--line);border-radius:20px}
.num{min-width:38px;height:38px;border-radius:14px;display:grid;place-items:center;font-weight:900;color:#140f0b;background:linear-gradient(135deg,var(--sand),#f1dbc0)}
.step p{margin:0;color:var(--muted);line-height:1.6}

.grid2{display:grid;grid-template-columns:repeat(2,1fr);gap:16px}
.shipping-grid{align-items:start}
.panel{padding:20px;border-radius:20px;border:1px solid var(--line);background:rgba(255,255,255,.025);box-shadow:0 10px 30px rgba(0,0,0,.16)}
.panel-soft{background:linear-gradient(180deg, rgba(255,255,255,.04), rgba(255,255,255,.02))}
.panel ul{margin:0;padding-left:18px;color:var(--muted);display:grid;gap:8px}
.panel p{line-height:1.65}

.faq-list{display:grid;grid-template-columns:repeat(2,1fr);gap:16px}
.faq-item{padding:20px;border-radius:20px;border:1px solid var(--line);background:rgba(255,255,255,.02)}
.faq-item p{margin:0;color:var(--muted)}

.final-cta{padding-bottom:78px}
.final-cta-inner{display:flex;justify-content:space-between;gap:22px;align-items:end;padding:30px;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.cta-stack{display:flex;gap:12px;flex-wrap:wrap}

.site-footer{padding:22px 0;border-top:1px solid var(--line);background:rgba(0,0,0,.18)}
.footer-inner{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap}
.brand-mini{display:flex;align-items:center;gap:10px;font-weight:900}
.foot-links{display:flex;gap:14px;flex-wrap:wrap}
.foot-links a{color:var(--muted);text-decoration:none;font-weight:700;font-size:14px}
.foot-links a:hover{color:var(--text)}

form{display:grid;gap:12px}
.field{display:grid;gap:7px}
.field span{font-weight:800;font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:rgba(242,238,232,.85)}
input, textarea, select{
  width:100%;padding:12px 14px;border-radius:14px;border:1px solid var(--line);
  background:rgba(0,0,0,.16);color:var(--text);outline:none;font:inherit;
}
input:focus, textarea:focus, select:focus{border-color:rgba(240,212,175,.65);box-shadow:0 0 0 4px rgba(240,212,175,.08)}
button{cursor:pointer}
.row{display:flex;gap:10px;flex-wrap:wrap;align-items:center}
.hidden{display:none}
.fineprint{margin:0;color:var(--muted);font-size:12.5px;line-height:1.5}

@media (max-width: 980px){
  .hero-split,.split-band,.grid2,.collection-grid,.product-grid,.faq-list,.quick-links-grid{grid-template-columns:1fr}
  .section-head,.final-cta-inner{display:grid}
  h1{font-size:46px;max-width:14ch}
  h2{font-size:34px}
}

@media (max-width: 760px){
  .nav{display:none}
  .mosaic-frame{min-height:360px;gap:8px;padding:12px}
  .tile{min-height:68px;border-radius:14px}
  .hero{padding-top:48px}
  .wrap{padding:0 18px}
}