/* Venkatadatta Weaves — design tokens
   Blended from: Starbucks (warm cream + ceremonial gold), Mastercard (orbital circles + pill radii),
   Apple (editorial whitespace), Ferrari (chiaroscuro restraint), Notion (warm serif minimalism). */

:root{
  --ivory:#F2F0EB;
  --ceramic:#EDEBE9;
  --ink:#2B1A1F;
  --maroon:#5A1C28;
  --maroon-deep:#3D1118;
  --gold:#CBA258;
  --gold-deep:#9C6B2E;
  --muted:#7A6A66;
  --line:rgba(43,26,31,.14);
  --shadow-lift:0 24px 70px -32px rgba(43,26,31,.28);
  --r-pill:50px;
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{
  background:var(--ivory);
  color:var(--ink);
  font-family:"Cormorant Garamond", Georgia, serif;
  font-size:19px;
  line-height:1.65;
  font-weight:400;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
  overflow-x:hidden;
}
img{display:block;max-width:100%;height:auto}
a{color:inherit;text-decoration:none;transition:color .2s ease, opacity .2s ease}
a:hover{color:var(--maroon)}

/* type */
h1,h2,h3,h4{
  font-family:"Marcellus", "Times New Roman", serif;
  font-weight:400;
  color:var(--ink);
  letter-spacing:-0.008em;
}
h1{font-size:clamp(48px,7vw,112px); line-height:1.02; letter-spacing:-0.012em}
h2{font-size:clamp(34px,4.5vw,64px); line-height:1.08}
h3{font-size:clamp(22px,2.2vw,30px); line-height:1.2}
h4{font-size:clamp(18px,1.6vw,22px); line-height:1.3}
p{max-width:62ch}
em{font-style:italic;color:var(--maroon)}

.eyebrow{
  font-family:"Inter",sans-serif;
  font-size:11px;
  letter-spacing:.30em;
  text-transform:uppercase;
  color:var(--gold-deep);
  font-weight:500;
}
.section-label{display:flex;align-items:center;gap:18px;margin-bottom:36px}
.section-label::before{content:"";width:42px;height:1px;background:var(--gold)}
.divider{text-align:center;font-family:"Marcellus",serif;color:var(--gold);font-size:22px;letter-spacing:1em;padding:24px 0}

/* nav */
nav.top{
  position:fixed;top:0;left:0;right:0;z-index:50;
  display:flex;align-items:center;justify-content:space-between;
  padding:22px 44px;
  background:linear-gradient(to bottom, rgba(242,240,235,.92), rgba(242,240,235,0));
  backdrop-filter:blur(8px);
  transition:padding .3s ease, background .3s ease;
}
nav.top.scrolled{
  padding:14px 44px;
  background:rgba(242,240,235,.96);
  border-bottom:1px solid var(--line);
}
nav.top .mark{
  font-family:"Marcellus",serif;font-size:17px;letter-spacing:.18em;text-transform:uppercase;
}
nav.top .mark span{color:var(--gold)}
nav.top ul{display:flex;gap:34px;list-style:none;align-items:center}
nav.top ul a{
  font-family:"Inter",sans-serif;font-size:11.5px;letter-spacing:.22em;text-transform:uppercase;
  color:var(--ink);opacity:.78;
}
nav.top ul a:hover, nav.top ul a.current{opacity:1;color:var(--maroon)}
nav.top .cta{
  display:inline-block;padding:11px 22px;border:1px solid var(--ink);border-radius:var(--r-pill);
  font-family:"Inter",sans-serif;font-size:10.5px;letter-spacing:.22em;text-transform:uppercase;
  color:var(--ink);opacity:1;transition:all .25s;
}
nav.top .cta:hover{background:var(--ink);color:var(--ivory)}
@media(max-width:980px){
  nav.top{padding:16px 22px}
  nav.top ul{display:none}
  nav.top .cta{padding:9px 16px;font-size:10px}
}

/* buttons */
.btn{
  display:inline-block;padding:14px 30px;border-radius:var(--r-pill);
  font-family:"Inter",sans-serif;font-size:11px;letter-spacing:.24em;text-transform:uppercase;
  cursor:pointer;border:1px solid var(--ink);background:var(--ink);color:var(--ivory);
  transition:all .25s;
}
.btn:hover{background:var(--maroon);border-color:var(--maroon);color:var(--ivory)}
.btn.ghost{background:transparent;color:var(--ink)}
.btn.ghost:hover{background:var(--ink);color:var(--ivory)}
.btn.gold{background:var(--gold);border-color:var(--gold);color:var(--ink)}
.btn.gold:hover{background:var(--gold-deep);border-color:var(--gold-deep);color:var(--ivory)}

/* sections */
section{padding:120px 60px;position:relative}
.container{max-width:1320px;margin:0 auto}
@media(max-width:780px){ section{padding:80px 26px} }

/* hero */
.hero{
  min-height:100vh;width:100%;
  display:grid;grid-template-columns:1.05fr 1fr;align-items:end;gap:60px;
  padding:140px 60px 80px;overflow:hidden;
}
.hero .lead{margin-top:36px;max-width:42ch;font-size:21px;opacity:.88}
.hero .meta{
  margin-top:54px;display:flex;gap:42px;
  font-family:"Inter",sans-serif;font-size:10.5px;letter-spacing:.24em;text-transform:uppercase;color:var(--muted);
}
.hero .meta b{display:block;font-family:"Marcellus",serif;font-size:24px;letter-spacing:.01em;color:var(--ink);text-transform:none;margin-bottom:6px;font-weight:400}
.hero .ctas{margin-top:42px;display:flex;gap:14px;flex-wrap:wrap}
.hero .right{position:relative;height:80vh}
.hero .right .frame{position:absolute;inset:0;background-size:cover;background-position:center;border:1px solid var(--line)}
.hero .right .frame::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg, transparent 55%, rgba(43,26,31,.32))}
.hero .right .caption{position:absolute;left:22px;bottom:20px;color:#F2EAD2;font-family:"Inter",sans-serif;font-size:10.5px;letter-spacing:.28em;text-transform:uppercase}
@media(max-width:980px){
  .hero{grid-template-columns:1fr;padding:130px 26px 60px;gap:36px;min-height:auto}
  .hero .right{height:60vh}
}

/* manifesto band */
.manifesto{background:var(--ceramic);padding:140px 60px;text-align:center}
.manifesto .pull{font-size:clamp(28px,3.2vw,46px);line-height:1.28;max-width:22ch;margin:0 auto;font-family:"Marcellus",serif}
.manifesto .sig{margin-top:48px;font-family:"Cormorant Garamond",serif;font-style:italic;font-size:22px;color:var(--muted)}

/* founder split */
.split{display:grid;grid-template-columns:1fr 1fr;gap:80px;align-items:center}
.split .portrait{position:relative;aspect-ratio:4/5;background-size:cover;background-position:center;border:1px solid var(--line)}
.split .portrait .tag{position:absolute;left:18px;bottom:18px;color:#F2EAD2;font-family:"Inter",sans-serif;font-size:10.5px;letter-spacing:.28em;text-transform:uppercase}
.split .copy h2{margin-bottom:28px}
.split .copy p{margin-bottom:22px;font-size:20px}
.split .copy .sign{margin-top:36px;font-family:"Marcellus",serif;font-size:24px}
.split .copy .sign small{display:block;font-family:"Inter",sans-serif;font-size:11px;letter-spacing:.26em;text-transform:uppercase;color:var(--muted);margin-top:8px}
@media(max-width:980px){ .split{grid-template-columns:1fr;gap:50px} }

/* orbital portrait — circular with traced arc (Mastercard-inspired) */
.orbital{position:relative;width:min(86%, 520px);margin:0 auto}
.orbital img{border-radius:50%;aspect-ratio:1;object-fit:cover;width:100%;border:1px solid var(--line)}
.orbital::before{
  content:"";position:absolute;inset:-22px;border-radius:50%;
  border:1px dashed var(--gold);opacity:.65;
  pointer-events:none;
}
.orbital::after{
  content:"";position:absolute;inset:-42px;border-radius:50%;
  border:1px solid var(--gold);opacity:.22;
  pointer-events:none;
}

/* dark band */
.dark{background:var(--ink);color:var(--ivory);padding:140px 60px}
.dark h2{color:var(--ivory)}
.dark p{color:#E2D5BC;opacity:.88}
.dark em{color:var(--gold)}

/* process cards */
.process-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:36px;margin-top:80px}
.process-grid .card{border-top:1px solid rgba(242,240,235,.22);padding-top:26px}
.process-grid .num{font-family:"Marcellus",serif;font-size:48px;color:var(--gold);line-height:1;display:block;margin-bottom:18px}
.process-grid h3{color:var(--ivory);margin-bottom:12px;font-size:24px}
.process-grid p{color:#E2D5BC;font-size:17px;line-height:1.6;opacity:.86}
@media(max-width:980px){ .process-grid{grid-template-columns:1fr 1fr;gap:30px} }

/* weave tiles */
.weave-row{display:grid;grid-template-columns:repeat(4,1fr);gap:24px}
.weave-tile{position:relative;aspect-ratio:3/4;overflow:hidden;border:1px solid var(--line);background-size:cover;background-position:center;transition:transform .6s ease;display:block}
.weave-tile:hover{transform:translateY(-4px)}
.weave-tile::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg, transparent 45%, rgba(43,26,31,.78))}
.weave-tile .label{position:absolute;left:22px;right:22px;bottom:22px;z-index:2;color:#F2EAD2}
.weave-tile .label .eyebrow{color:var(--gold);margin-bottom:10px;display:block}
.weave-tile .label h3{color:#F2EAD2;font-size:24px}
.weave-tile .label .price{font-family:"Inter",sans-serif;font-size:11px;letter-spacing:.22em;text-transform:uppercase;opacity:.86;margin-top:8px}
@media(max-width:980px){ .weave-row{grid-template-columns:1fr 1fr} }

/* product grid */
.product-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:36px;margin-top:60px}
.product-card{display:block;border:1px solid var(--line);background:var(--ivory);transition:box-shadow .4s, transform .4s}
.product-card:hover{box-shadow:var(--shadow-lift);transform:translateY(-2px)}
.product-card .img{aspect-ratio:3/4;background-size:cover;background-position:center}
.product-card .body{padding:22px 24px 26px}
.product-card .body .eyebrow{margin-bottom:6px}
.product-card h3{font-size:22px;margin-bottom:6px}
.product-card .weaver{font-family:"Inter",sans-serif;font-size:11px;letter-spacing:.18em;color:var(--muted);text-transform:uppercase;margin-bottom:14px}
.product-card .price{font-family:"Marcellus",serif;font-size:20px;color:var(--maroon)}
@media(max-width:980px){ .product-grid{grid-template-columns:1fr 1fr} }
@media(max-width:600px){ .product-grid{grid-template-columns:1fr} }

/* journal */
.journal-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:36px;margin-top:60px}
.journal-card{cursor:pointer;display:block}
.journal-card .img{aspect-ratio:3/2;background-size:cover;background-position:center;border:1px solid var(--line);margin-bottom:22px;transition:transform .5s}
.journal-card:hover .img{transform:scale(1.02)}
.journal-card .meta{font-family:"Inter",sans-serif;font-size:10.5px;letter-spacing:.26em;text-transform:uppercase;color:var(--muted);margin-bottom:10px}
.journal-card h3{font-size:24px;margin-bottom:10px}
.journal-card p{color:var(--muted);font-size:18px}
@media(max-width:980px){ .journal-grid{grid-template-columns:1fr} }

/* visit / dark maroon */
.visit{background:var(--maroon);color:var(--ivory);padding:140px 60px;display:grid;grid-template-columns:1fr 1fr;gap:80px;align-items:center}
.visit h2{color:var(--ivory)}
.visit h2 em{color:var(--gold)}
.visit p{font-size:20px;margin-bottom:18px;color:#EDD9B5;opacity:.94}
.visit .address{margin-top:40px;font-family:"Marcellus",serif;font-size:22px;line-height:1.55}
.visit .address small{display:block;font-family:"Inter",sans-serif;font-size:11px;letter-spacing:.24em;text-transform:uppercase;color:var(--gold);margin-top:14px}
.visit .hours{margin-top:32px;border-top:1px solid rgba(242,240,235,.22);padding-top:26px;font-size:18px;color:#EDD9B5}
.visit .map{aspect-ratio:1/1;background-size:cover;background-position:center;border:1px solid rgba(242,240,235,.18)}
@media(max-width:980px){ .visit{grid-template-columns:1fr;padding:90px 28px} }

/* newsletter */
.news{padding:120px 60px;text-align:center;background:var(--ceramic)}
.news h2{max-width:20ch;margin:0 auto 18px}
.news p{margin:0 auto 36px;color:var(--muted);font-size:20px;max-width:46ch}
.news form{display:flex;max-width:520px;margin:0 auto;gap:0;border:1px solid var(--line);background:var(--ivory);border-radius:var(--r-pill);overflow:hidden;padding:4px 4px 4px 24px}
.news input{flex:1;border:0;background:transparent;padding:14px 0;font-family:"Cormorant Garamond",serif;font-size:18px;color:var(--ink);outline:none}
.news button{border:0;background:var(--ink);color:var(--ivory);padding:0 26px;font-family:"Inter",sans-serif;font-size:11px;letter-spacing:.24em;text-transform:uppercase;cursor:pointer;border-radius:var(--r-pill);transition:background .25s}
.news button:hover{background:var(--maroon)}

/* footer */
footer{background:var(--ink);color:#C9B89A;padding:80px 60px 40px;display:grid;grid-template-columns:1.5fr 1fr 1fr 1fr;gap:50px}
footer .brand{font-family:"Marcellus",serif;color:var(--ivory);font-size:24px;letter-spacing:.04em;margin-bottom:18px}
footer .brand span{color:var(--gold)}
footer p{font-size:16px;color:#9C8E76;max-width:38ch}
footer h4{font-family:"Inter",sans-serif;font-size:11px;letter-spacing:.26em;text-transform:uppercase;color:var(--ivory);font-weight:500;margin-bottom:18px}
footer ul{list-style:none}
footer li{margin-bottom:10px;font-size:16px}
footer li a:hover{color:var(--gold)}
footer .bottom{grid-column:1/-1;border-top:1px solid rgba(255,255,255,.08);margin-top:30px;padding-top:24px;display:flex;justify-content:space-between;font-family:"Inter",sans-serif;font-size:11px;letter-spacing:.22em;text-transform:uppercase;color:#7A6C56}
@media(max-width:980px){
  footer{grid-template-columns:1fr 1fr;gap:36px;padding:60px 28px 30px}
  footer .bottom{flex-direction:column;gap:12px}
}

/* breadcrumb */
.crumb{font-family:"Inter",sans-serif;font-size:11px;letter-spacing:.24em;text-transform:uppercase;color:var(--muted);padding:108px 60px 0}
.crumb a{color:var(--muted)}
.crumb a:hover{color:var(--maroon)}
.crumb span{margin:0 10px;color:var(--gold)}
@media(max-width:780px){ .crumb{padding:96px 26px 0} }

/* utility */
.center{text-align:center}
.mt-l{margin-top:54px}

/* floating contact widget */
.contact-fab{
  position:fixed;right:24px;bottom:24px;z-index:60;
  display:flex;flex-direction:column;gap:12px;
}
.contact-fab a{
  width:54px;height:54px;border-radius:50%;
  display:flex;align-items:center;justify-content:center;
  background:var(--ink);color:var(--ivory);
  box-shadow:0 10px 30px -10px rgba(43,26,31,.5);
  font-family:"Inter",sans-serif;font-size:10px;letter-spacing:.14em;text-transform:uppercase;font-weight:500;
  transition:transform .25s, background .25s;
}
.contact-fab a:hover{transform:translateY(-2px);color:var(--gold)}
.contact-fab a.wa{background:#25785F}
.contact-fab a.ig{background:linear-gradient(135deg,#5A1C28,#9C6B2E)}
.contact-fab a.tel{background:var(--ink)}
.contact-fab a svg{width:24px;height:24px}
@media(max-width:600px){
  .contact-fab{right:14px;bottom:14px}
  .contact-fab a{width:48px;height:48px}
}

/* enquire pill (replaces price in cards) */
.enquire{
  display:inline-block;font-family:"Inter",sans-serif;font-size:10.5px;
  letter-spacing:.22em;text-transform:uppercase;color:var(--gold-deep);
  padding-top:4px;font-weight:500;
}
.enquire::after{content:" →";color:var(--gold)}


/* Logo image in nav and footer */
nav.top .mark{display:flex;align-items:center;gap:14px;font-size:15px;letter-spacing:.16em}
nav.top .mark img{height:42px;width:auto;display:block}
nav.top.scrolled .mark img{height:36px;transition:height .25s}
@media(max-width:780px){
  nav.top .mark img{height:34px}
  nav.top .mark .wordmark{display:none}
}
footer .brand{display:flex;align-items:center;gap:14px}
footer .brand img{height:50px;width:auto;display:block}


/* Mobile hero + CTA refinements */
@media(max-width:780px){
  .hero{padding:96px 22px 50px;gap:24px}
  .hero h1{font-size:clamp(38px,11vw,56px);line-height:1.05}
  .hero .lead{font-size:18px;margin-top:24px}
  .hero .meta{margin-top:38px;gap:24px;flex-wrap:wrap}
  .hero .meta b{font-size:20px}
  .hero .ctas{margin-top:30px;gap:10px}
  .hero .right{height:54vh}
  .btn{padding:13px 22px;font-size:10.5px;letter-spacing:.18em;white-space:nowrap}
  .btn.gold{padding:13px 22px}
}
.btn{white-space:nowrap}
@media(max-width:420px){
  .hero h1{font-size:clamp(34px,10vw,48px)}
  .btn{padding:12px 18px;font-size:10px;letter-spacing:.14em}
}

/* Logo swap target — when assets/img/logo-color.png lands, this picks it up */
nav.top .mark img[data-variant="color"]{height:46px}
@media(max-width:780px){ nav.top .mark img[data-variant="color"]{height:38px} }


/* weave-tile image rendering */
.weave-tile picture, .weave-tile img{
  position:absolute;inset:0;width:100%;height:100%;
  object-fit:cover;display:block;z-index:0;
}
.weave-tile .label{z-index:2}
.weave-tile::after{z-index:1}
