@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:wght@400;500;600&family=Inter:wght@400;500;600&display=swap');

:root{
  --ivory:#f6f2e8;
  --paper:#fbf8f1;
  --ink:#222;
  --muted:#69645c;
  --line:#928b80;
  --soft:rgba(80,75,68,.22);
  --purple:#5d2ca6;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--ivory);color:var(--ink);font-family:Inter,Arial,sans-serif;line-height:1.55;-webkit-font-smoothing:antialiased}
a{color:inherit;text-decoration:none}
button,input,select,textarea{font:inherit}
img{max-width:100%}
.page{width:min(100% - 32px,1180px);margin:0 auto}
.site-header{padding:38px 0 26px;border-bottom:1px solid var(--soft);background:var(--paper)}
.brand{text-align:center}
.monogram{font:500 clamp(2.6rem,7vw,4.7rem)/.9 "Cormorant Garamond",Georgia,serif;letter-spacing:.28em;margin-left:.28em}
.brand-name{margin-top:12px;font:600 .9rem "Cormorant Garamond",Georgia,serif;letter-spacing:.22em}
.main-nav{display:flex;justify-content:center;gap:clamp(28px,7vw,90px);margin-top:32px;flex-wrap:wrap}
.main-nav a{font-size:.82rem;letter-spacing:.28em;text-transform:uppercase;color:#5f6062}
.main-nav a:hover,.main-nav a[aria-current="page"]{color:var(--ink)}
.hero{padding:54px 0 36px;text-align:center}
.eyebrow{font-size:.64rem;letter-spacing:.25em;text-transform:uppercase;color:var(--muted);margin:0 0 7px}
.hero h1{font:500 clamp(2.6rem,7vw,5rem)/.95 "Cormorant Garamond",Georgia,serif;margin:0}
.hero p{max-width:620px;margin:18px auto 0;color:var(--muted);font-size:.9rem}
.filters{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:12px;padding:22px;border:1px solid #cec6b8;background:var(--paper);margin-bottom:34px}
.filter label{display:block;font-size:.67rem;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);margin-bottom:7px}
.filter input,.filter select{width:100%;height:44px;border:1px solid #aaa195;background:#fffdf8;padding:0 11px;color:var(--ink);outline:none}
.filter input:focus,.filter select:focus{border-color:var(--purple)}
.catalog-meta{display:flex;justify-content:space-between;gap:20px;align-items:center;margin:12px 0 18px;color:var(--muted);font-size:.78rem}
.catalog-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:28px 22px;padding-bottom:64px}
.watch-card{display:block}
.watch-image{aspect-ratio:4/5;background:#e8e2d7;border:1px solid #c7c0b4;overflow:hidden}
.watch-image img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .35s ease}
.watch-card:hover .watch-image img{transform:scale(1.02)}
.watch-copy{padding:13px 3px 0}
.watch-brand{font-size:.67rem;letter-spacing:.16em;text-transform:uppercase;color:var(--muted)}
.watch-title{font:600 1.65rem/1.05 "Cormorant Garamond",Georgia,serif;margin:4px 0 5px}
.watch-reference{font-size:.76rem;color:var(--muted)}
.watch-bottom{display:flex;justify-content:space-between;gap:12px;align-items:flex-end;margin-top:12px}
.price{font-weight:600}
.status{font-size:.65rem;letter-spacing:.12em;text-transform:uppercase;color:var(--purple)}
.empty{grid-column:1/-1;padding:60px 20px;border:1px dashed #bdb4a7;text-align:center;color:var(--muted)}
.content-page{width:min(100% - 32px,820px);margin:0 auto;padding:66px 0 90px}
.content-page h1{font:500 clamp(2.8rem,7vw,4.6rem)/.95 "Cormorant Garamond",Georgia,serif;margin:0 0 28px}
.content-page h2{font:500 2rem "Cormorant Garamond",Georgia,serif;margin-top:38px}
.content-page p{color:var(--muted);line-height:1.85}
.watch-detail{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(320px,.85fr);gap:54px;padding:54px 0 80px}
.detail-main-image{aspect-ratio:4/5;border:1px solid #aaa195;background:#eee7db;overflow:hidden}
.detail-main-image img{display:block;width:100%;height:100%;object-fit:cover}
.thumbnails{display:grid;grid-template-columns:repeat(5,1fr);gap:8px;margin-top:10px}
.thumb{padding:0;border:1px solid #c7c0b4;background:none;aspect-ratio:1;overflow:hidden;cursor:pointer}
.thumb img{width:100%;height:100%;object-fit:cover;display:block}
.thumb.active{border-color:var(--purple)}
.detail-kicker{font-size:.67rem;letter-spacing:.18em;text-transform:uppercase;color:var(--muted)}
.detail-title{font:500 clamp(2.8rem,5vw,4.7rem)/.9 "Cormorant Garamond",Georgia,serif;margin:7px 0 8px}
.detail-ref{color:var(--muted);font-size:.82rem}
.detail-price{font-size:1.3rem;font-weight:600;margin:24px 0 6px}
.detail-status{color:var(--purple);font-size:.7rem;letter-spacing:.15em;text-transform:uppercase}
.whatsapp-button{display:flex;align-items:center;justify-content:center;min-height:52px;background:var(--purple);color:white;font-weight:600;margin:26px 0 34px;padding:12px 18px}
.detail-description{color:var(--muted);line-height:1.8;white-space:pre-wrap}
.specs{margin-top:34px;border-top:1px solid var(--soft)}
.spec-row{display:grid;grid-template-columns:140px 1fr;gap:18px;padding:12px 0;border-bottom:1px solid var(--soft)}
.spec-label{font-size:.67rem;letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}
.back-link{display:inline-block;margin-top:34px;font-size:.72rem;letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}
.footer{border-top:1px solid var(--soft);padding:34px 0 46px;text-align:center;background:var(--paper)}
.footer-brand{font:600 1rem "Cormorant Garamond",Georgia,serif;letter-spacing:.16em}
.footer p{color:var(--muted);font-size:.7rem}
@media(max-width:900px){
  .filters{grid-template-columns:repeat(2,minmax(0,1fr))}
  .catalog-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .watch-detail{grid-template-columns:1fr;gap:30px}
}
@media(max-width:580px){
  .site-header{padding-top:26px}
  .main-nav{gap:20px;margin-top:24px}
  .main-nav a{font-size:.72rem;letter-spacing:.18em}
  .hero{padding-top:38px}
  .filters{grid-template-columns:1fr;padding:16px}
  .catalog-grid{grid-template-columns:1fr}
  .watch-title{font-size:1.8rem}
  .spec-row{grid-template-columns:110px 1fr}
}
