/* ===== SITE C — Affirmé / campagne ===== */
.sc { min-height:100vh; display:flex; flex-direction:column; background:var(--st-paper); }
.sc .wrap { width:100%; max-width:1320px; margin:0 auto; padding-inline:56px; }
.sc main { flex:1; }
.sc-disp { font-family:var(--font-display); font-weight:400; letter-spacing:var(--tracking-tight); line-height:.98; }

/* header dark */
.sc-promo { background:var(--st-blue); color:var(--st-black); text-align:center; font-size:12.5px; letter-spacing:.06em; padding:9px 0; font-weight:500; }
.sc-head { position:sticky; top:0; z-index:40; background:var(--st-black); }
.sc-head .bar { height:80px; display:flex; align-items:center; justify-content:space-between; }
.sc-nav { display:flex; gap:28px; }
.sc-nav button { background:none; border:none; color:rgba(255,255,255,.85); font:var(--text-small); padding:6px 0; }
.sc-nav button.active, .sc-nav button:hover { color:#fff; }
.sc-nav button.active { text-decoration:underline; text-underline-offset:6px; text-decoration-color:var(--st-orange); text-decoration-thickness:2px; }
.sc-acts { display:flex; align-items:center; gap:12px; color:#fff; }
.sc-cartpill { display:inline-flex; align-items:center; gap:8px; background:var(--st-orange); color:#fff; border:none; border-radius:var(--r-pill); padding:9px 16px; font-size:13px; font-weight:500; }

/* color block helpers */
.cb { padding:46px 0; }
.cb-blue { background:var(--st-blue); }
.cb-bluesoft { background:var(--st-blue-soft); }
.cb-orange { background:var(--st-orange); color:#fff; }
.cb-orangesoft { background:var(--st-orange-soft); }
.cb-ink { background:var(--st-black); color:#fff; }
.cb-paper { background:var(--st-paper); }

/* hero */
.sc-hero .inner { display:grid; grid-template-columns:1.05fr .95fr; gap:56px; align-items:center; padding-block:52px; }
.sc-hero h1 { font-family:var(--font-display); font-size:clamp(56px,8vw,108px); line-height:.92; letter-spacing:-.02em; margin:14px 0 18px; }
.sc-hero .frame { background:rgba(255,255,255,.55); border:2px solid var(--st-black); border-radius:var(--r-lg); overflow:hidden; height:400px; }
.sc-hero .frame image-slot, .sc-hero .frame img { width:100%; height:100%; }

/* TRB triple blocks */
.sc-trb { display:grid; grid-template-columns:repeat(3,1fr); border-top:2px solid var(--st-black); border-bottom:2px solid var(--st-black); }
.sc-trb .cell { padding:56px 46px; }
.sc-trb .cell + .cell { border-left:2px solid var(--st-black); }
.sc-trb .n { font-family:var(--font-display); font-size:60px; line-height:1; }
.sc-trb .t { font-family:var(--font-display); font-size:36px; margin:4px 0 14px; }
.sc-trb p { line-height:1.6; font-size:15px; opacity:.9; margin:0; }

/* products */
.sc-prodhead { display:flex; justify-content:space-between; align-items:flex-end; padding-bottom:28px; }
.sc-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:22px; }
.sc-card { border:2px solid var(--st-black); border-radius:var(--r-md); overflow:hidden; background:var(--st-paper); cursor:pointer; display:flex; flex-direction:column;
  transition:transform .18s, box-shadow .18s; }
.sc-card:hover { transform:translateY(-3px); box-shadow:8px 8px 0 var(--st-blue); }
.sc-card .ph { aspect-ratio:1/1; overflow:hidden; border-bottom:2px solid var(--st-black); background:var(--st-blue-soft); }
.sc-card .ph img { width:100%; height:100%; object-fit:cover; }
.sc-card .body { padding:16px 18px; }
.sc-card .cat { font:var(--text-eyebrow); letter-spacing:var(--tracking-eyebrow); text-transform:uppercase; color:var(--st-orange); }
.sc-card .nm { font-family:var(--font-display); font-size:25px; margin:5px 0 12px; }
.sc-card .foot { display:flex; align-items:center; justify-content:space-between; }
.sc-card .pr { font-family:var(--font-display); font-size:22px; }
.sc-cadd { width:38px; height:38px; border-radius:var(--r-pill); border:2px solid var(--st-black); background:#fff; display:inline-flex; align-items:center; justify-content:center; transition:background .15s,color .15s; }
.sc-cadd:hover { background:var(--st-orange); color:#fff; border-color:var(--st-orange); }

/* statement band */
.sc-stmt { text-align:center; padding-block:56px; }
.sc-stmt h2 { font-family:var(--font-display); font-size:clamp(34px,4.4vw,58px); color:#fff; margin:0 auto; max-width:18ch; line-height:1.05; }

/* reviews */
.sc-revs { display:grid; grid-template-columns:repeat(3,1fr); gap:22px; }
.sc-rev { border:2px solid var(--st-black); border-radius:var(--r-md); padding:24px; background:#fff; }
.sc-rev .st { color:var(--st-orange); letter-spacing:2px; }
.sc-rev p { margin:14px 0 16px; line-height:1.55; }

/* category tiles (shop) */
.sc-cats { display:grid; grid-template-columns:repeat(4,1fr); gap:18px; }
.sc-cat { border:2px solid var(--st-black); border-radius:var(--r-md); padding:24px 22px; height:130px; display:flex; flex-direction:column; justify-content:space-between; cursor:pointer; }
.sc-cat .nm { font-family:var(--font-display); font-size:28px; }

/* PDP */
.sc-pdp { display:grid; grid-template-columns:1fr 1fr; border-bottom:2px solid var(--st-black); }
.sc-pdp .left { padding:62px 56px; display:flex; flex-direction:column; align-items:center; justify-content:center; border-right:2px solid var(--st-black); }
.sc-pdp .left .main { width:100%; height:420px; border:2px solid var(--st-black); border-radius:var(--r-md); overflow:hidden; background:rgba(255,255,255,.5); }
.sc-pdp .left .main img { width:100%; height:100%; object-fit:cover; }
.sc-pdp .left .thumbs { display:flex; gap:12px; margin-top:16px; }
.sc-pdp .left .thumbs .t { width:72px; height:72px; border:2px solid var(--st-black); border-radius:var(--r-sm); overflow:hidden; }
.sc-pdp .left .thumbs .t img { width:100%; height:100%; object-fit:cover; }
.sc-pdp .right { padding:62px 56px; }
.sc-pdp .right h1 { font-family:var(--font-display); font-size:clamp(40px,4.4vw,60px); line-height:1; margin:12px 0 8px; }
.sc-pdp .price { font-family:var(--font-display); font-size:40px; }
.sc-qty { display:inline-flex; align-items:center; gap:14px; border:2px solid var(--st-black); border-radius:var(--r-pill); padding:6px 14px; }
.sc-benef { display:grid; grid-template-columns:repeat(3,1fr); border-bottom:2px solid var(--st-black); }
.sc-benef .b { padding:48px 42px; }
.sc-benef .b + .b { border-left:2px solid var(--st-black); }
.sc-benef h4 { font-family:var(--font-display); font-size:28px; margin:0 0 10px; }

/* about */
.sc-mv { display:grid; grid-template-columns:1fr 1fr; border-bottom:2px solid var(--st-black); }
.sc-mv .c { padding:62px 56px; }
.sc-mv .c:first-child { border-right:2px solid var(--st-black); }
.sc-mv h3 { font-family:var(--font-display); font-size:40px; margin:0 0 16px; }
.sc-mv p { color:var(--fg-2); line-height:1.75; }
.sc-vals { display:grid; grid-template-columns:repeat(3,1fr); border-bottom:2px solid var(--st-black); }
.sc-vals .v { padding:56px 44px; }
.sc-vals .v + .v { border-left:2px solid var(--st-black); }
.sc-vals h4 { font-family:var(--font-display); font-size:30px; margin:0 0 12px; }

/* contact */
.sc-cgrid { display:grid; grid-template-columns:1.3fr .7fr; gap:40px; align-items:start; }
.sc-form { border:2px solid var(--st-black); border-radius:var(--r-md); padding:32px; }
.sc-form label { display:block; font-size:13px; font-weight:500; margin:0 0 7px; }
.sc-form .f { margin-bottom:18px; }
.sc-input { width:100%; border:2px solid var(--st-black); border-radius:var(--r-sm); padding:11px 14px; font:var(--text-body); outline:none; }
.sc-input:focus { border-color:var(--st-orange); }
.sc-ctiles { display:flex; flex-direction:column; gap:16px; }
.sc-ctile { border:2px solid var(--st-black); border-radius:var(--r-md); padding:20px 22px; display:flex; gap:12px; align-items:center; }
.sc-ctile h4 { margin:0; font-family:var(--font-display); font-size:22px; }
.sc-ctile p { margin:2px 0 0; font-size:13px; }

/* footer */
.sc-foot { background:var(--st-black); color:rgba(255,255,255,.78); padding:58px 0 28px; }
.sc-foot .cols { display:flex; justify-content:space-between; gap:40px; flex-wrap:wrap; }
.sc-foot h5 { color:#fff; font-size:14px; margin:0 0 12px; font-weight:500; }
.sc-foot a, .sc-foot button { color:rgba(255,255,255,.7); font-size:14px; display:block; padding:5px 0; background:none; border:none; text-align:left; }
.sc-foot a:hover, .sc-foot button:hover { color:#fff; }
.sc-foot .bot { display:flex; justify-content:space-between; border-top:1px solid var(--line-on-dark); margin-top:30px; padding-top:16px; font-size:12.5px; color:rgba(255,255,255,.5); }

@media (max-width:940px){
  .sc-hero .inner,.sc-trb,.sc-grid,.sc-cats,.sc-revs,.sc-pdp,.sc-benef,.sc-mv,.sc-vals,.sc-cgrid{grid-template-columns:1fr;}
  .sc-trb .cell + .cell,.sc-benef .b + .b,.sc-vals .v + .v,.sc-mv .c:first-child{border-left:none;border-right:none;border-top:2px solid var(--st-black);}
  .sc-pdp .left{border-right:none;border-bottom:2px solid var(--st-black);}
  .sc-nav{display:none;}
}