/* ===== Homepage-specific ===== */

/* hero slider (2 slides, left/right) */
.hero{position:relative;height:680px;overflow:hidden;background:#2d261e}
.hero-track{position:absolute;inset:0}
.hero-slide{position:absolute;inset:0;background-size:cover;background-position:center 38%;opacity:0;visibility:hidden;transition:opacity 1s ease;display:flex;align-items:center}
.hero-slide.is-active{opacity:1;visibility:visible}
.hero-scrim{position:absolute;inset:0}
.hero-scrim.left{background:linear-gradient(100deg,rgba(40,33,26,.76) 0%,rgba(50,42,33,.45) 44%,transparent 74%)}
.hero-scrim.right{background:linear-gradient(260deg,rgba(40,33,26,.76) 0%,rgba(50,42,33,.45) 44%,transparent 74%)}
.hero-inner{position:relative;z-index:2;width:100%;padding:60px 28px}
.hero-inner.right{display:flex;justify-content:flex-end;text-align:right}
.hero-copy{max-width:560px}
.hero-inner.right .hero-cta,.hero-inner.right .hero-stats{justify-content:flex-end}
.hero-eyebrow{color:#ffd9a6}
.hero-copy h1{font-size:58px;line-height:1.14;font-weight:700;letter-spacing:0;margin:16px 0 20px;color:#fff;text-shadow:0 2px 24px rgba(0,0,0,.3)}
.hero-copy h1 em{font-style:normal;color:#ffce8c;font-weight:700}
.hero-copy p{font-size:16.5px;color:rgba(255,255,255,.93);text-shadow:0 1px 14px rgba(0,0,0,.35)}
.hero-cta{display:flex;gap:14px;margin:30px 0 36px;flex-wrap:wrap}
.hero-stats{display:flex;gap:44px}
.hero-stats b{font-family:var(--serif);font-size:30px;color:#fff;font-weight:700;display:block}
.hero-stats span{font-size:11.5px;letter-spacing:.14em;text-transform:uppercase;color:rgba(255,255,255,.82)}
/* directional content reveal per active slide */
.hero-slide .hero-copy>*{opacity:0}
.hero-slide[data-align=left].is-active .hero-copy>*{animation:hInL .85s cubic-bezier(.2,.7,.2,1) forwards}
.hero-slide[data-align=right].is-active .hero-copy>*{animation:hInR .85s cubic-bezier(.2,.7,.2,1) forwards}
.hero-copy>*:nth-child(1){animation-delay:.15s}
.hero-copy>*:nth-child(2){animation-delay:.3s}
.hero-copy>*:nth-child(3){animation-delay:.45s}
.hero-copy>*:nth-child(4){animation-delay:.6s}
.hero-copy>*:nth-child(5){animation-delay:.75s}
@keyframes hInL{from{opacity:0;transform:translateX(-44px)}to{opacity:1;transform:none}}
@keyframes hInR{from{opacity:0;transform:translateX(44px)}to{opacity:1;transform:none}}
.hero-dots{position:absolute;bottom:28px;left:50%;transform:translateX(-50%);display:flex;gap:10px;z-index:4}
.hero-dots button{width:11px;height:11px;border-radius:50%;background:rgba(255,255,255,.55);transition:.25s;cursor:pointer}
.hero-dots button.active{background:#fff;width:30px;border-radius:6px}
.hero-scroll{position:absolute;bottom:24px;right:34px;width:26px;height:42px;border:2px solid rgba(255,255,255,.5);border-radius:14px;z-index:3}
.hero-scroll span{position:absolute;top:8px;left:50%;width:4px;height:8px;margin-left:-2px;background:#fff;border-radius:2px;animation:scrollDot 1.6s infinite}
@keyframes scrollDot{0%{opacity:0;transform:translateY(0)}40%{opacity:1}80%{opacity:0;transform:translateY(14px)}100%{opacity:0}}
@media(prefers-reduced-motion:reduce){.hero-slide .hero-copy>*{animation:none;opacity:1}}

/* trust */
.trust{background:var(--surface);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.trust-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:24px;padding:34px 28px}
.trust-item{display:flex;align-items:center;gap:14px;justify-content:center}
.trust-item .ti-ic{width:46px;height:46px;border-radius:50%;background:var(--cream);display:flex;align-items:center;justify-content:center;color:var(--accent);flex:none}
.trust-item .ti-ic svg{width:26px;height:26px;fill:currentColor;stroke:none}
.trust-item b{display:block;color:var(--ink);font-size:16px;font-weight:600}
.trust-item span{font-size:14px;color:var(--muted)}

/* about */
.about-grid{display:grid;grid-template-columns:1fr 1fr;gap:60px;align-items:center}
.about-media{display:grid;grid-template-columns:1fr 1fr;grid-template-rows:1fr 1fr;gap:16px;height:460px}
.about-media .am{background:#fff;border:1px solid var(--line);border-radius:14px;overflow:hidden}
.about-media .am img{width:100%;height:100%;object-fit:cover}
.about-media .am:nth-child(1){border-radius:14px 14px 14px 60px}
.about-media .am:nth-child(4){border-radius:60px 14px 14px 14px}
.about-copy h2{font-size:36px;font-weight:600;line-height:1.2;margin:14px 0 18px}
.about-copy p{margin-bottom:16px}
.about-copy .btn{margin-top:10px}

/* category grid */
.cat-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.cat-card{position:relative;border-radius:18px;overflow:hidden;background:#fff;border:1px solid var(--line);aspect-ratio:1/.78;display:flex;align-items:flex-end;transition:.3s}
.cat-card:hover{box-shadow:var(--shadow);transform:translateY(-4px)}
.cat-card img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;padding:30px;transition:.4s}
.cat-card:hover img{transform:scale(1.06)}
.cat-card .cc-label{position:relative;z-index:2;width:100%;padding:20px 22px;background:linear-gradient(to top,rgba(31,27,22,.78),transparent);color:#fff}
.cat-card .cc-label b{font-family:var(--serif);font-size:21px;font-weight:400;display:block;letter-spacing:.02em}
.cat-card .cc-label span{font-size:12px;letter-spacing:.1em;text-transform:uppercase;opacity:.85}

/* featured tabs */
.tabs{display:flex;justify-content:center;gap:10px;margin-bottom:40px;flex-wrap:wrap}
.tabs button{padding:11px 26px;border-radius:999px;font-size:13px;letter-spacing:.12em;text-transform:uppercase;color:var(--coffee);border:1px solid var(--line-strong);transition:.22s}
.tabs button.active,.tabs button:hover{background:var(--taupe);color:#fff;border-color:var(--taupe)}

/* promo */
.promo{background:linear-gradient(120deg,#F5921F 0%,#e9700f 100%);color:#fff6ec;overflow:hidden}
.promo-inner{display:grid;grid-template-columns:1fr 1fr;gap:40px;align-items:center;min-height:380px}
.promo-copy{padding:60px 0}
.promo-copy h2{color:#fff;font-size:40px;font-weight:600;line-height:1.2;margin:14px 0 18px}
.promo-copy p{color:rgba(255,255,255,.92);max-width:420px;margin-bottom:28px}
.promo-media{position:relative;height:100%;min-height:380px}
.promo-media .pm-card{position:absolute;background:#fff;border-radius:18px;overflow:hidden;box-shadow:var(--shadow)}
.promo-media .pm-card img{width:100%;height:100%;object-fit:cover}
.pm1{width:54%;height:64%;right:6%;top:14%}
.pm2{width:40%;height:46%;right:42%;bottom:12%}

/* newsletter */
.newsletter{background:var(--cream);text-align:center}
.news-inner h2{font-size:36px;font-weight:600}
.news-inner>p{color:var(--muted);margin:10px 0 28px}
.news-form{display:flex;gap:12px;max-width:520px;margin:0 auto}
.news-form input{flex:1;border:1px solid var(--line-strong);border-radius:999px;padding:15px 24px;font-size:15px;font-family:var(--sans);background:#fff;outline:none;color:var(--ink)}
.news-form input:focus{border-color:var(--accent)}
.news-contact{margin-top:24px;font-size:13px;color:var(--muted);letter-spacing:.04em}

@media(max-width:1024px){
  .hero-copy h1{font-size:48px}
  .cat-grid{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:768px){
  .hero{height:540px}
  .hero-slide{background-position:center 30%}
  .hero-scrim.left,.hero-scrim.right{background:linear-gradient(180deg,rgba(45,38,30,.5),rgba(45,38,30,.78))}
  .hero-inner,.hero-inner.right{padding:60px 18px;justify-content:flex-start;text-align:left}
  .hero-inner.right .hero-cta,.hero-inner.right .hero-stats{justify-content:flex-start}
  .hero-copy h1{font-size:34px}
  .hero-stats{gap:26px}
  .trust-grid{grid-template-columns:1fr 1fr;gap:20px}
  .about-grid{grid-template-columns:1fr;gap:34px}
  .about-media{height:320px}
  .promo-inner{grid-template-columns:1fr}
  .promo-media{min-height:280px;margin-bottom:30px}
  .promo-copy{padding:44px 0 0}
  .news-form{flex-direction:column}
  .news-form .btn{justify-content:center}
}
