@import url('https://fonts.googleapis.com/css2?family=Fraunces:opsz,wght@9..144,400;9..144,500;9..144,600&family=Jost:wght@400;500;600&display=swap');

:root{
  --rust:#8C3B23;
  --rust-deep:#5E2717;
  --ivory:#F7F1E6;
  --ivory-2:#EFE6D6;
  --sand:#C9A98C;
  --charcoal:#2B2523;
  --line: rgba(43,37,35,0.14);
}

*{box-sizing:border-box; margin:0; padding:0;}
html{scroll-behavior:smooth;}
body{
  font-family:'Jost', sans-serif;
  background:var(--ivory);
  color:var(--charcoal);
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
}
h1,h2,h3,.display{
  font-family:'Fraunces', serif;
  font-weight:500;
  letter-spacing:-0.01em;
  line-height:1.08;
}
a{color:inherit; text-decoration:none;}
img{display:block; max-width:100%;}
.wrap{max-width:1180px; margin:0 auto; padding:0 28px;}

.nav{
  position:sticky; top:0; z-index:50;
  background:rgba(247,241,230,0.92);
  backdrop-filter:blur(8px);
  border-bottom:1px solid var(--line);
}
.nav .wrap{display:flex; align-items:center; justify-content:space-between; height:78px;}
.nav-logo{display:flex; align-items:center; gap:12px;}
.nav-logo img{height:40px; width:auto;}
.nav-logo span{font-family:'Fraunces', serif; font-size:1.15rem; letter-spacing:0.02em;}
.nav-links{display:flex; gap:36px; font-size:0.92rem; letter-spacing:0.03em; text-transform:uppercase;}
.nav-links a{position:relative; padding-bottom:4px;}
.nav-links a::after{content:''; position:absolute; left:0; bottom:0; width:0; height:1px; background:var(--rust); transition:width .25s ease;}
.nav-links a:hover::after, .nav-links a.active::after{width:100%;}
.nav-cta{border:1px solid var(--charcoal); padding:9px 20px; border-radius:999px; font-size:0.85rem; letter-spacing:0.03em; white-space:nowrap; transition:background .2s ease, color .2s ease;}
.nav-cta:hover{background:var(--charcoal); color:var(--ivory);}
@media (max-width:820px){ .nav-links{display:none;} }

.hero{position:relative; min-height:88vh; display:flex; align-items:flex-end; overflow:hidden; background:var(--charcoal);}
.hero img{position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:center; opacity:0.82;}
.hero::after{content:''; position:absolute; inset:0; background:linear-gradient(180deg, rgba(20,14,12,0.05) 0%, rgba(20,14,12,0.75) 100%);}
.hero-inner{position:relative; z-index:2; padding:0 28px 72px; max-width:1180px; margin:0 auto; width:100%; color:var(--ivory);}
.hero-eyebrow{font-size:0.82rem; letter-spacing:0.18em; text-transform:uppercase; color:var(--sand); margin-bottom:18px; display:block;}
.hero h1{font-size:clamp(2.6rem, 6vw, 5rem); max-width:820px; margin-bottom:22px;}
.hero p{font-size:1.05rem; max-width:480px; color:rgba(247,241,230,0.88); margin-bottom:34px;}
.hero-ctas{display:flex; gap:16px; flex-wrap:wrap;}

.btn{display:inline-flex; align-items:center; gap:8px; padding:14px 30px; border-radius:999px; font-size:0.92rem; letter-spacing:0.02em; transition:transform .2s ease, background .2s ease, color .2s ease;}
.btn-primary{background:var(--rust); color:var(--ivory);}
.btn-primary:hover{background:var(--rust-deep); transform:translateY(-2px);}
.btn-outline{border:1px solid rgba(247,241,230,0.6); color:var(--ivory);}
.btn-outline:hover{background:rgba(247,241,230,0.12); transform:translateY(-2px);}

.section{padding:96px 0;}
.section-tight{padding:64px 0;}
.eyebrow{font-size:0.8rem; letter-spacing:0.18em; text-transform:uppercase; color:var(--rust); margin-bottom:14px; display:block;}
.section h2{font-size:clamp(1.9rem, 3.4vw, 2.7rem); max-width:640px;}
.section-sub{max-width:520px; color:rgba(43,37,35,0.72); margin-top:14px; font-size:1.02rem;}
.divider{height:1px; background:var(--line); border:none; margin:0;}

.intro{display:grid; grid-template-columns:1.1fr 0.9fr; gap:64px; align-items:center;}
@media (max-width:860px){ .intro{grid-template-columns:1fr;} }
.intro-quote{font-family:'Fraunces', serif; font-size:clamp(1.5rem,2.6vw,2.1rem); line-height:1.3; color:var(--rust-deep);}
.intro-body p{color:rgba(43,37,35,0.75); margin-top:16px;}

.cat-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:22px; margin-top:52px;}
@media (max-width:860px){ .cat-grid{grid-template-columns:1fr;} }
.cat-card{position:relative; aspect-ratio:3/4; overflow:hidden; border-radius:4px; display:block;}
.cat-card img{width:100%; height:100%; object-fit:cover; transition:transform .6s cubic-bezier(.2,.8,.2,1);}
.cat-card:hover img{transform:scale(1.05);}
.cat-card::after{content:''; position:absolute; inset:0; background:linear-gradient(180deg, rgba(20,14,12,0) 40%, rgba(20,14,12,0.65) 100%);}
.cat-label{position:absolute; left:22px; bottom:22px; z-index:2; color:var(--ivory);}
.cat-label .cat-name{font-family:'Fraunces', serif; font-size:1.4rem;}
.cat-label .cat-count{font-size:0.8rem; opacity:0.85; letter-spacing:0.04em;}

.shop-nav{display:flex; gap:28px; margin:8px 0 44px; flex-wrap:wrap; font-size:0.85rem; letter-spacing:0.06em; text-transform:uppercase;}
.shop-nav a{padding-bottom:6px; border-bottom:2px solid transparent; color:rgba(43,37,35,0.55);}
.shop-nav a:hover{color:var(--rust); border-color:var(--rust);}

.product-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:28px 22px;}
@media (max-width:900px){ .product-grid{grid-template-columns:repeat(2,1fr);} }
@media (max-width:560px){ .product-grid{grid-template-columns:1fr;} }
.product-img{aspect-ratio:1/1; overflow:hidden; border-radius:4px; background:var(--ivory-2); margin-bottom:14px;}
.product-img img{width:100%; height:100%; object-fit:cover; transition:transform .5s ease;}
.product-card:hover .product-img img{transform:scale(1.04);}
.product-name{font-family:'Fraunces', serif; font-size:1.08rem; margin-bottom:4px;}
.product-meta{font-size:0.85rem; color:rgba(43,37,35,0.6); margin-bottom:10px;}
.product-link{font-size:0.82rem; letter-spacing:0.03em; color:var(--rust); border-bottom:1px solid var(--rust); padding-bottom:2px;}
.product-link:hover{color:var(--rust-deep); border-color:var(--rust-deep);}
.category-heading{margin:80px 0 8px;}
.category-heading:first-of-type{margin-top:0;}

.about-hero{padding:150px 0 60px; text-align:center;}
.about-hero .eyebrow{display:block; text-align:center;}
.about-hero h1{max-width:760px; margin:0 auto 20px;}
.about-hero p{max-width:560px; margin:0 auto; color:rgba(43,37,35,0.72); font-size:1.05rem;}

.about-collage{display:grid; grid-template-columns:repeat(3,1fr); gap:18px; margin:56px 0;}
@media (max-width:760px){ .about-collage{grid-template-columns:repeat(2,1fr);} }
.about-collage img{aspect-ratio:1/1; object-fit:cover; border-radius:4px;}
.about-collage img:nth-child(2){margin-top:36px;}
.about-collage img:nth-child(3){margin-top:-36px;}
@media (max-width:760px){ .about-collage img:nth-child(2), .about-collage img:nth-child(3){margin-top:0;} }

.values{display:grid; grid-template-columns:repeat(3,1fr); gap:36px; margin-top:56px;}
@media (max-width:760px){ .values{grid-template-columns:1fr;} }
.value-num{font-family:'Fraunces', serif; color:var(--sand); font-size:1rem; margin-bottom:12px;}
.value-title{font-family:'Fraunces', serif; font-size:1.25rem; margin-bottom:10px;}
.value-body{color:rgba(43,37,35,0.7); font-size:0.95rem;}

.cta-band{background:var(--charcoal); color:var(--ivory); padding:80px 0; text-align:center;}
.cta-band h2{color:var(--ivory); margin:0 auto 18px; max-width:600px;}
.cta-band p{color:rgba(247,241,230,0.75); max-width:480px; margin:0 auto 32px;}
.cta-band .btns{display:flex; gap:16px; justify-content:center; flex-wrap:wrap;}

footer{padding:52px 0 40px; border-top:1px solid var(--line);}
.footer-grid{display:flex; justify-content:space-between; align-items:flex-start; gap:32px; flex-wrap:wrap;}
.footer-brand{display:flex; align-items:center; gap:12px;}
.footer-brand img{height:34px;}
.footer-brand span{font-family:'Fraunces', serif; font-size:1.05rem;}
.footer-links{display:flex; gap:28px; font-size:0.9rem; flex-wrap:wrap;}
.footer-links a:hover{color:var(--rust);}
.footer-bottom{margin-top:36px; padding-top:22px; border-top:1px solid var(--line); font-size:0.8rem; color:rgba(43,37,35,0.55); display:flex; justify-content:space-between; flex-wrap:wrap; gap:10px;}

.wa-float{position:fixed; right:22px; bottom:22px; z-index:60; background:var(--rust); color:var(--ivory); width:56px; height:56px; border-radius:50%; display:flex; align-items:center; justify-content:center; box-shadow:0 8px 24px rgba(140,59,35,0.35); transition:transform .2s ease;}
.wa-float:hover{transform:scale(1.08);}

.platform-strip{padding:56px 0; text-align:center; border-top:1px solid var(--line);}
.platform-strip .eyebrow{display:block; text-align:center;}
.platform-badges{
  display:flex; justify-content:center; gap:14px; flex-wrap:wrap; margin-top:22px;
}
.platform-badge{
  padding:11px 26px; border-radius:999px; border:1px solid var(--line);
  font-family:'Fraunces', serif; font-size:0.98rem; color:var(--charcoal);
  background:var(--ivory-2);
}
