
  :root{
    --cream:#F8F2E6;
    --sand:#EFE3CB;
    --taupe:#B99B6E;
    --gold:#9C7A3F;
    --gold-deep:#7C602E;
    --ink:#2E2418;
    --ink-soft:#5B4C39;
    --card:#FFFDF8;
    --line: rgba(46,36,24,0.14);
    --serif: 'Cormorant Garamond', serif;
    --sans: 'Jost', sans-serif;
  }

  *{box-sizing:border-box;}
  html{scroll-behavior:smooth;}
  body{
    margin:0;
    background:var(--cream);
    color:var(--ink);
    font-family:var(--sans);
    font-weight:300;
    line-height:1.6;
    -webkit-font-smoothing:antialiased;
  }
  img{max-width:100%;display:block;}
  a{color:inherit;text-decoration:none;}
  .wrap{max-width:1180px;margin:0 auto;padding:0 32px;}

  /* ---------- corner motif (svg data) shared ---------- */
  .motif{
    width:34px;height:34px;
    opacity:0.75;
  }

  /* ---------- header ---------- */
  header{
    position:sticky;top:0;z-index:50;
    background:rgba(248,242,230,0.92);
    backdrop-filter:blur(6px);
    border-bottom:1px solid var(--line);
  }
  .nav-inner{
    display:flex;align-items:center;justify-content:space-between;
    padding:16px 32px;
    max-width:1180px;margin:0 auto;
  }
  .logo-mark{display:flex;align-items:center;gap:10px;}
  .logo-mark img{height:46px;width:auto;}
  nav.links{display:flex;gap:40px;}
  nav.links a{
    font-size:14.5px;
    letter-spacing:.03em;
    color:var(--ink-soft);
    position:relative;
    padding-bottom:4px;
    transition:color .25s ease;
  }
  nav.links a::after{
    content:"";
    position:absolute;left:0;right:0;bottom:0;
    height:1px;background:var(--gold);
    transform:scaleX(0);
    transform-origin:right;
    transition:transform .3s ease;
  }
  nav.links a:hover{color:var(--ink);}
  nav.links a:hover::after{transform:scaleX(1);transform-origin:left;}

  .burger{display:none;flex-direction:column;gap:5px;cursor:pointer;background:none;border:none;padding:4px;}
  .burger span{width:24px;height:1px;background:var(--ink);display:block;}

  /* ---------- hero ---------- */
  .hero{
    display:grid;
    grid-template-columns:1.05fr 0.95fr;
    align-items:stretch;
    min-height:640px;
  }
  .hero-copy{
    display:flex;flex-direction:column;justify-content:center;
    padding:60px 64px 60px 32px;
    max-width:560px;margin:0 auto;
  }
  .eyebrow-line{
    display:flex;align-items:center;gap:14px;
    margin-bottom:22px;
  }
  .eyebrow-line span{
    font-family:var(--sans);
    font-size:13px;letter-spacing:.14em;
    color:var(--gold-deep);
  }
  .eyebrow-line .rule{height:1px;width:48px;background:var(--gold);}

  .hero-copy h1{
    font-family:var(--serif);
    font-weight:500;
    font-size:clamp(42px,5vw,62px);
    line-height:1.08;
    margin:0 0 24px;
    color:var(--ink);
  }
  .hero-copy h1 em{font-style:italic;font-weight:500;color:var(--gold-deep);}
  .hero-copy p{
    font-size:16.5px;
    color:var(--ink-soft);
    max-width:440px;
    margin:0 0 34px;
  }
  .btn-row{display:flex;gap:18px;align-items:center;flex-wrap:wrap;}
  .btn-primary{
    display:inline-block;
    background:var(--ink);
    color:var(--cream);
    padding:15px 34px;
    font-size:14px;letter-spacing:.05em;
    border:1px solid var(--ink);
    transition:background .3s ease,color .3s ease;
  }
  .btn-primary:hover{background:transparent;color:var(--ink);}
  .btn-ghost{
    font-size:14px;
    color:var(--ink-soft);
    border-bottom:1px solid var(--taupe);
    padding-bottom:3px;
  }
  .btn-ghost:hover{color:var(--ink);border-color:var(--ink);}

  .hero-frame{
    position:relative;
    padding:22px;
    display:flex;
  }
  .hero-frame::before{
    content:"";
    position:absolute;inset:22px;
    border:1px solid var(--gold);
    z-index:1;
    pointer-events:none;
  }
  .hero-frame::after{
    content:"";
    position:absolute;inset:30px;
    border:1px solid var(--gold);
    opacity:.55;
    pointer-events:none;
  }
  .hero-frame img{
    width:100%;height:100%;object-fit:cover;
  }

  /* ---------- policy strip ---------- */
  .policy-strip{
    background:var(--ink);
    color:var(--sand);
  }
  .policy-inner{
    max-width:1180px;margin:0 auto;
    padding:26px 32px;
    display:grid;
    grid-template-columns:1fr 1px 1fr;
    gap:32px;
    align-items:center;
  }
  .policy-inner .divider{background:rgba(239,227,203,0.25);height:100%;}
  .policy-item{
    font-family:var(--serif);
    font-style:italic;
    font-size:16.5px;
    line-height:1.55;
    color:var(--sand);
    text-align:center;
  }

  /* ---------- section heading pattern ---------- */
  .section-head{
    text-align:center;
    max-width:640px;margin:0 auto 56px;
  }
  .section-head .motif{margin:0 auto 18px;}
  .section-head h2{
    font-family:var(--serif);
    font-weight:500;
    font-size:clamp(32px,3.6vw,44px);
    margin:0 0 14px;
  }
  .section-head p{
    color:var(--ink-soft);
    font-size:15.5px;
    margin:0;
  }

  section{padding:96px 0;}

  /* ---------- about ---------- */
  .about{background:var(--sand);}
  .about-grid{
    display:grid;
    grid-template-columns:0.9fr 1.1fr;
    gap:64px;
    align-items:center;
  }
  .about-images{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:16px;
  }
  .about-images img{
    width:100%;
    aspect-ratio:3/4;
    object-fit:cover;
    border:1px solid var(--line);
  }
  .about-images img:first-child{
    margin-top:36px;
  }
  .about-text .eyebrow-line{margin-bottom:18px;}
  .about-text h2{
    font-family:var(--serif);
    font-weight:500;
    font-size:clamp(30px,3.4vw,40px);
    margin:0 0 22px;
    line-height:1.16;
  }
  .about-text p{
    color:var(--ink-soft);
    font-size:16px;
    margin:0 0 18px;
    max-width:480px;
  }
  .fabric-row{
    display:flex;gap:36px;
    margin-top:32px;
    flex-wrap:wrap;
  }
  .fabric-item h4{
    font-family:var(--serif);
    font-size:20px;font-weight:600;
    margin:0 0 6px;
  }
  .fabric-item p{
    font-size:13.5px;
    color:var(--ink-soft);
    margin:0;
    max-width:220px;
  }

  /* ---------- collection ---------- */
  .collection-grid{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:2px;
    background:var(--line);
    border:1px solid var(--line);
  }
  .product-card{
    background:var(--card);
    display:flex;flex-direction:column;
  }
  .product-link{display:flex;flex-direction:column;flex:1;}
  .product-media{
    position:relative;
    overflow:hidden;
    aspect-ratio:3/4;
  }
  .product-media img{
    width:100%;height:100%;object-fit:cover;
    transition:transform .6s ease;
  }
  .product-card:hover .product-media img{transform:scale(1.045);}
  .product-tag{
    position:absolute;top:14px;left:14px;
    background:rgba(248,242,230,0.92);
    color:var(--ink);
    font-size:11px;letter-spacing:.08em;
    padding:6px 12px;
  }
  .product-info{
    padding:22px 24px 4px;
    display:flex;flex-direction:column;gap:8px;
    flex:1;
  }
  .product-info h3{
    font-family:var(--serif);
    font-weight:600;
    font-size:21px;
    margin:0;
    transition:color .25s ease;
  }
  .product-card:hover .product-info h3{color:var(--gold-deep);}
  .product-info .fabric{
    font-size:12.5px;
    color:var(--taupe);
    letter-spacing:.03em;
  }
  .price-row{
    margin-top:auto;
    display:flex;align-items:center;justify-content:space-between;
    padding-top:14px;
    border-top:1px solid var(--line);
  }
  .price-row.wrap-price{padding:14px 24px 26px;}
  .price{
    font-family:var(--serif);
    font-size:18px;
    color:var(--ink);
  }
  .enquire{
    font-size:12.5px;
    letter-spacing:.04em;
    color:var(--gold-deep);
    border-bottom:1px solid var(--gold);
    padding-bottom:2px;
  }
  .enquire:hover{color:var(--ink);border-color:var(--ink);}

  .collection-more{
    text-align:center;
    margin-top:48px;
  }

  /* ---------- category tabs ---------- */
  .cat-tabs{
    display:flex;
    justify-content:center;
    gap:0;
    margin:-24px 0 48px;
  }
  .cat-tab{
    font-family:var(--serif);
    font-size:17px;
    letter-spacing:.02em;
    color:var(--ink-soft);
    background:none;
    border:none;
    cursor:pointer;
    padding:10px 30px;
    border-bottom:1px solid var(--line);
    transition:color .25s ease, border-color .25s ease;
  }
  .cat-tab.active{
    color:var(--ink);
    border-bottom:1px solid var(--gold);
  }
  .cat-tab:hover{color:var(--ink);}
  .product-card.is-hidden{display:none;}

  /* ---------- contact / cta ---------- */
  .cta{
    background:var(--ink);
    color:var(--cream);
    text-align:center;
  }
  .cta .motif{filter:invert(1);opacity:.6;}
  .cta h2{
    font-family:var(--serif);
    font-weight:500;
    font-size:clamp(30px,3.6vw,44px);
    margin:18px 0 16px;
  }
  .cta p{
    color:#CDBFA7;
    max-width:480px;margin:0 auto 34px;
    font-size:15.5px;
  }
  .cta .btn-primary{background:var(--gold);border-color:var(--gold);color:var(--ink);}
  .cta .btn-primary:hover{background:transparent;color:var(--cream);border-color:var(--cream);}

  /* ---------- footer ---------- */
  footer{
    background:#241C13;
    color:#C9BB9F;
    padding:64px 0 0;
  }
  .footer-grid{
    display:grid;
    grid-template-columns:1.3fr 1fr 1fr;
    gap:48px;
    padding-bottom:48px;
    border-bottom:1px solid rgba(201,187,159,0.15);
  }
  .footer-brand img{height:44px;margin-bottom:16px;filter:brightness(0) invert(1) opacity(.9);}
  .footer-brand p{
    font-size:14px;line-height:1.7;
    max-width:280px;
    color:#A9977A;
  }
  .footer-col h5{
    font-family:var(--sans);
    font-size:13px;letter-spacing:.08em;
    color:#E7DAC0;
    margin:0 0 20px;
  }
  .footer-col a, .footer-col p{
    display:block;
    font-size:14.5px;
    color:#B7A886;
    margin-bottom:12px;
    transition:color .25s ease;
  }
  .footer-col a:hover{color:#F4EBD8;}
  .footer-bottom{
    display:flex;justify-content:space-between;align-items:center;
    padding:24px 0;
    font-size:12.5px;
    color:#7C6E56;
    flex-wrap:wrap;gap:10px;
  }

  /* ---------- mobile nav ---------- */
  .mobile-panel{
    display:none;
    flex-direction:column;
    gap:0;
    background:var(--cream);
    border-top:1px solid var(--line);
  }
  .mobile-panel a{
    padding:16px 32px;
    border-bottom:1px solid var(--line);
    font-size:15px;
  }
  .mobile-panel.open{display:flex;}

  /* ---------- responsive ---------- */
  @media (max-width:960px){
    .hero{grid-template-columns:1fr;min-height:auto;}
    .hero-frame{order:-1;min-height:420px;}
    .hero-copy{max-width:none;padding:52px 32px;}
    .about-grid{grid-template-columns:1fr;}
    .about-grid img{aspect-ratio:16/10;}
    .collection-grid{grid-template-columns:repeat(2,1fr);}
    .footer-grid{grid-template-columns:1fr 1fr;}
    .footer-brand{grid-column:1/-1;}
  }
  @media (max-width:640px){
    .wrap{padding:0 20px;}
    nav.links{display:none;}
    .burger{display:flex;}
    .policy-inner{grid-template-columns:1fr;text-align:center;}
    .policy-inner .divider{display:none;}
    .collection-grid{grid-template-columns:1fr;}
    .footer-grid{grid-template-columns:1fr;}
    .nav-inner{padding:14px 20px;}
  }

  /* ---------- product detail page ---------- */
  .breadcrumb{
    padding:24px 0 0;
    font-size:13px;
    color:var(--ink-soft);
  }
  .breadcrumb a{color:var(--gold-deep);}
  .breadcrumb a:hover{color:var(--ink);}

  .product-detail{
    padding:40px 0 100px;
  }
  .detail-grid{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:64px;
    align-items:flex-start;
  }
  .detail-frame{
    position:relative;
    padding:20px;
  }
  .detail-frame::before{
    content:"";
    position:absolute;inset:20px;
    border:1px solid var(--gold);
    pointer-events:none;
  }
  .detail-frame::after{
    content:"";
    position:absolute;inset:28px;
    border:1px solid var(--gold);
    opacity:.55;
    pointer-events:none;
  }
  .detail-frame img{
    width:100%;
    aspect-ratio:3/4;
    object-fit:cover;
  }
  .detail-tag{
    display:inline-block;
    font-size:12px;letter-spacing:.1em;
    color:var(--gold-deep);
    border:1px solid var(--gold);
    padding:6px 16px;
    margin-bottom:20px;
  }
  .detail-info h1{
    font-family:var(--serif);
    font-weight:500;
    font-size:clamp(32px,3.6vw,44px);
    margin:0 0 14px;
    line-height:1.15;
  }
  .detail-price{
    font-family:var(--serif);
    font-size:26px;
    color:var(--ink);
    margin:0 0 24px;
  }
  .detail-fabric{
    font-size:14px;
    color:var(--taupe);
    letter-spacing:.03em;
    margin:0 0 26px;
    padding-bottom:26px;
    border-bottom:1px solid var(--line);
  }
  .detail-desc{
    font-size:16px;
    color:var(--ink-soft);
    margin:0 0 32px;
    max-width:460px;
  }
  .detail-specs{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:18px 24px;
    margin:0 0 36px;
    padding:24px 0;
    border-top:1px solid var(--line);
    border-bottom:1px solid var(--line);
  }
  .detail-specs div h5{
    font-family:var(--sans);
    font-size:11.5px;
    letter-spacing:.08em;
    color:var(--taupe);
    margin:0 0 6px;
  }
  .detail-specs div p{
    font-family:var(--serif);
    font-size:17px;
    margin:0;
    color:var(--ink);
  }
  .whatsapp-btn{
    display:inline-flex;
    align-items:center;
    gap:12px;
    background:var(--ink);
    color:var(--cream);
    padding:17px 36px;
    font-size:14.5px;letter-spacing:.05em;
    border:1px solid var(--ink);
    transition:background .3s ease,color .3s ease;
  }
  .whatsapp-btn:hover{background:transparent;color:var(--ink);}
  .whatsapp-btn svg{width:19px;height:19px;flex-shrink:0;}
  .detail-note{
    margin-top:20px;
    font-size:13px;
    color:var(--ink-soft);
    font-style:italic;
    font-family:var(--serif);
  }

  .related-head{
    margin:96px 0 32px;
    padding-top:56px;
    border-top:1px solid var(--line);
    text-align:center;
  }
  .related-head h3{
    font-family:var(--serif);
    font-weight:500;
    font-size:28px;
    margin:0;
  }

  .not-found{
    padding:120px 0;
    text-align:center;
  }
  .not-found h1{
    font-family:var(--serif);
    font-size:36px;
    margin:0 0 16px;
  }
  .not-found p{color:var(--ink-soft);margin:0 0 28px;}

  @media (max-width:900px){
    .detail-grid{grid-template-columns:1fr;gap:36px;}
    .detail-specs{grid-template-columns:1fr 1fr;}
  }
