/* Sorrell & Smith live-edge mirror pages (Chateau oak, Rivergrain elm).
   Same look as the glass, chair and leg pages: black & white, light grey
   panels, Abel / Oswald / Actor, plus a full-width film hero. Scoped under .ssm. */

.ssm{
  --ssm-black:#111111; --ssm-cream:#F4F4F4; --ssm-ink:#222222; --ssm-soft:#666666; --ssm-rule:#E4E4E4;
  --ssm-line:#CCCCCC; --ssm-green:#3F7A4A; --ssm-hover:#3A3A3A;
  --ssm-head:'Abel',Helvetica,Arial,sans-serif; --ssm-btn:'Oswald',Helvetica,Arial,sans-serif; --ssm-body:'Actor',Helvetica,Arial,sans-serif;
  font-family:var(--ssm-body); color:var(--ssm-soft); font-size:15px; line-height:1.65; background:#fff; padding-top:0 !important;
}
.ssm *,.ssm *::before,.ssm *::after{box-sizing:border-box}
.ssm [hidden]{display:none !important}
.ssm h1,.ssm h2,.ssm h3{font-family:var(--ssm-head);color:var(--ssm-ink);font-weight:500;line-height:1.2;padding:0}
.ssm h2{font-size:clamp(24px,2.8vw,32px);margin:0 0 10px}
.ssm h3{font-size:21px;margin:0 0 10px}
.ssm p{padding:0;margin:0 0 14px}
.ssm a{color:var(--ssm-ink)}
.ssm ul{list-style:none !important;padding:0 !important;margin:0}
.ssm img{max-width:100%}
.ssm-wrap{max-width:1180px;margin:0 auto;padding:0 24px}
.ssm-muted{color:var(--ssm-soft)}
.ssm-kicker{font-family:var(--ssm-btn);font-size:12px;letter-spacing:2.4px;text-transform:uppercase;color:#777;margin:0 0 8px}
.ssm-crumbs{font-size:13px;color:#8a8a8a;margin:0 0 18px;padding-top:22px}
.ssm-crumbs a{color:#8a8a8a;text-decoration:none}
.ssm-crumbs span{margin:0 7px}
.ssm-notices:empty{display:none}
.ssm-admin{background:#111;color:#e6e6e6;display:flex;flex-wrap:wrap;gap:8px 20px;align-items:center;padding:10px 16px;font-size:13px;margin:0 0 18px}
.ssm-admin-tag{font-family:var(--ssm-btn);letter-spacing:1.6px;font-size:11px;text-transform:uppercase;color:#d6d6d6}
.ssm-admin a{margin-left:auto;background:#fff;color:#111;padding:5px 12px;text-decoration:none;font-weight:600}

.ssm-btn{display:inline-flex;align-items:center;justify-content:center;font-family:var(--ssm-btn);font-size:14px;letter-spacing:3px;text-transform:uppercase;
  text-decoration:none !important;color:#fff !important;background:var(--ssm-black);border:2px solid var(--ssm-black);padding:11px 22px;border-radius:0;white-space:nowrap;cursor:pointer}
.ssm-btn-outline{background:transparent;color:var(--ssm-black) !important}
.ssm-btn-outline:hover{background:var(--ssm-black);color:#fff !important}
.ssm-btn-light{background:#fff;color:var(--ssm-black) !important;border-color:#fff}
.ssm-btn-light:hover{background:transparent;color:#fff !important}

/* ---------- film hero ---------- */
/* The films are 1280 × 720: the hero is never taller than 720 px and the
   film never wider than 1280 px, so it is never scaled up (no pixelation on
   big monitors). Wider screens get the film centred, its edges fading into
   the dark background. */
.ssm-hero{position:relative;height:clamp(560px,84vh,720px);overflow:hidden;background:#15110e;color:#fff;display:flex;align-items:flex-end}
.ssm-hero-media{position:absolute;top:0;bottom:0;left:0;right:0;max-width:1280px;margin:0 auto}
@media (min-width:1281px){.ssm-hero-media{-webkit-mask-image:linear-gradient(90deg,transparent 0,#000 14%,#000 86%,transparent 100%);mask-image:linear-gradient(90deg,transparent 0,#000 14%,#000 86%,transparent 100%)}}
.ssm-hero-media video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}
.ssm-hero-media img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center 45%;opacity:0;transition:opacity 1.8s ease;animation:ssm-kb 16s ease-in-out infinite alternate}
.ssm-hero-media img.on{opacity:1}
@keyframes ssm-kb{from{transform:scale(1.14) translate(-2%,1%)}to{transform:scale(1.02) translate(2%,-1%)}}
.ssm-hero-shade{position:absolute;inset:0;background:linear-gradient(90deg,rgba(10,7,5,.8) 0%,rgba(10,7,5,.5) 36%,rgba(10,7,5,0) 68%),linear-gradient(0deg,rgba(10,7,5,.75) 0%,rgba(10,7,5,0) 46%),linear-gradient(180deg,rgba(10,7,5,.35) 0%,rgba(10,7,5,0) 18%)}
.ssm-hero-in{position:relative;width:100%;padding-bottom:58px}
.ssm-hero .ssm-kicker{color:rgba(255,255,255,.72)}
.ssm-hero h1{color:#fff;font-size:clamp(44px,6.2vw,88px);line-height:1;letter-spacing:.3px;max-width:760px;margin:0 0 18px}
.ssm-hero-line{font-size:18px;line-height:1.55;max-width:500px;color:rgba(255,255,255,.86)}
.ssm-hero-btns{display:flex;gap:12px;flex-wrap:wrap;margin-top:26px}
.ssm-hero-facts{display:flex;max-width:620px;margin:42px 0 0 !important;border-top:1px solid rgba(255,255,255,.28)}
.ssm-hero-facts li{flex:1;padding:16px 18px 0 0;display:flex;flex-direction:column;gap:5px}
.ssm-hero-facts li+li{padding-left:18px;border-left:1px solid rgba(255,255,255,.28)}
.ssm-hero-facts strong{font-family:var(--ssm-head);font-weight:400;font-size:34px;line-height:1;color:#fff}
.ssm-hero-facts span{font-size:12.5px;line-height:1.4;color:rgba(255,255,255,.7)}
.ssm-hero-cue{position:absolute;right:max(34px,calc(50% - 640px + 60px));bottom:34px;display:flex;flex-direction:column;align-items:center;gap:10px;font-family:var(--ssm-btn);font-size:11px;letter-spacing:2.4px;text-transform:uppercase;color:rgba(255,255,255,.75) !important;text-decoration:none}
.ssm-hero-cue::after{content:"";width:1px;height:46px;background:linear-gradient(rgba(255,255,255,.9),rgba(255,255,255,0));animation:ssm-cue 2.2s ease-in-out infinite}
@keyframes ssm-cue{0%{transform:scaleY(0);transform-origin:top}50%{transform:scaleY(1);transform-origin:top}51%{transform-origin:bottom}100%{transform:scaleY(0);transform-origin:bottom}}

/* ---------- product ---------- */
.ssm-pdp{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:26px 52px;padding:6px 0 44px;align-items:start}
.ssm-gallery{position:sticky;top:90px;min-width:0}
.ssm-main{position:relative;border:1px solid var(--ssm-rule);background:#f7f5f2;overflow:hidden;aspect-ratio:4/5;cursor:zoom-in}
.ssm-main.is-film{cursor:default}
.ssm-main img,.ssm-main video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}
.ssm-tag{position:absolute;left:14px;top:14px;background:rgba(255,255,255,.92);font-family:var(--ssm-btn);font-size:11px;letter-spacing:2px;text-transform:uppercase;color:var(--ssm-ink);padding:5px 10px;pointer-events:none}
.ssm-thumbs{display:flex;gap:10px;overflow-x:auto;padding:12px 0 4px;scrollbar-width:thin}
.ssm-thumbs button{position:relative;flex:1 1 0;min-width:58px;max-width:84px;aspect-ratio:1;padding:0;border:1px solid var(--ssm-rule);background:#fff;cursor:pointer;opacity:.7;border-radius:0}
.ssm-thumbs button.active,.ssm-thumbs button:hover{opacity:1;border-color:var(--ssm-black)}
.ssm-thumbs img{width:100%;height:100%;object-fit:cover;display:block}
.ssm-thumbs .ssm-t-film{opacity:1}
.ssm-thumbs .ssm-t-film span{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;background:rgba(15,10,7,.5);color:#fff;font-family:var(--ssm-btn);font-size:10px;letter-spacing:1.5px;text-transform:uppercase}
.ssm-thumbs .ssm-t-film span::before{content:"▶";font-size:18px;margin-bottom:1px}

.ssm-buy{min-width:0;scroll-margin-top:110px}
.ssm .ssm-title{font-size:clamp(30px,4vw,42px);margin:0 0 10px}
.ssm-intro{font-size:16px}
.ssm-headline{display:flex;align-items:baseline;gap:10px;flex-wrap:wrap;margin:6px 0 2px}
.ssm-price{font-family:var(--ssm-head);font-size:36px;color:var(--ssm-black);font-weight:600;line-height:1.1}
.ssm-price-for{font-size:16px;color:var(--ssm-ink)}
.ssm-sub{font-size:14px;margin:0 0 22px !important}

.ssm-step{margin:0 0 22px}
.ssm-step-label{display:flex;align-items:center;gap:8px;font-weight:600;color:var(--ssm-ink);font-size:14.5px;margin:0 0 10px}
.ssm-step-label b{display:inline-grid;place-items:center;width:22px;height:22px;border-radius:50%;background:var(--ssm-black);color:#fff;font-size:12px;font-family:var(--ssm-btn)}
.ssm-step-label small{font-weight:400;color:var(--ssm-soft);font-size:13px}

.ssm-woods{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.ssm-wood{display:flex;gap:12px;align-items:center;padding:10px;border:1px solid var(--ssm-line);background:#fff;text-decoration:none !important;color:var(--ssm-ink) !important;transition:border-color .15s}
.ssm-wood:hover{border-color:var(--ssm-black)}
.ssm-wood.active{border-color:var(--ssm-black);box-shadow:inset 0 0 0 1px var(--ssm-black)}
.ssm-wood img{width:58px;height:58px;object-fit:cover;flex:none}
.ssm-wood strong{display:block;font-family:var(--ssm-head);font-size:19px;font-weight:500;line-height:1.2}
.ssm-wood small{display:block;font-size:12.5px;color:var(--ssm-soft);line-height:1.35}
.ssm-wood .ssm-from{display:block;font-size:13px;font-weight:600;color:var(--ssm-black);margin-top:3px}

.ssm-presets{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin-bottom:12px}
.ssm-preset{padding:10px 6px 9px;border:1px solid var(--ssm-line);background:#fff;cursor:pointer;font-family:var(--ssm-body);color:var(--ssm-ink);text-align:center;transition:.15s;display:flex;flex-direction:column;align-items:center;gap:4px;border-radius:0}
.ssm-preset:hover{border-color:var(--ssm-black)}
.ssm-preset.active{border-color:var(--ssm-black);box-shadow:inset 0 0 0 1px var(--ssm-black)}
.ssm-preset .ssm-box{height:46px;display:flex;align-items:center;justify-content:center}
.ssm-preset .ssm-shape{display:block;border:2px solid #b89a78;background:linear-gradient(135deg,#eef3f5,#d9e3e7)}
.ssm-preset .ssm-shape.custom{width:24px;height:24px;border-style:dashed;background:#fff}
.ssm-preset.active .ssm-shape{border-color:var(--ssm-black)}
.ssm-preset strong{font-size:13.5px;font-weight:600;line-height:1.2}
.ssm-preset span.ssm-pn{font-size:12px;color:var(--ssm-soft);line-height:1.2}
.ssm-preset em{font-style:normal;font-size:12.5px;font-weight:600;color:var(--ssm-black);min-height:1.2em}

.ssm-size{display:flex;align-items:flex-end;gap:10px}
.ssm-field{flex:1;display:flex;flex-direction:column;gap:4px;font-size:13px;color:var(--ssm-soft);position:relative;min-width:0}
.ssm-field input{font-family:var(--ssm-body);font-size:18px;color:var(--ssm-ink);border:1px solid var(--ssm-line);border-radius:0;padding:10px 40px 10px 12px;width:100%;background:#fff;-moz-appearance:textfield}
.ssm-field input::-webkit-outer-spin-button,.ssm-field input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}
.ssm-field input:focus{border-color:var(--ssm-black);outline:none}
.ssm-field em{position:absolute;right:12px;bottom:12px;font-style:normal;color:#999;font-size:14px}
.ssm-x{font-size:20px;color:#999;padding-bottom:10px}
.ssm-help{font-size:13px;margin:8px 0 0 !important}
.ssm-warn{font-size:13.5px;background:#FFF4D6;color:#6B4E00;padding:9px 12px;margin:10px 0 0 !important}
.ssm-warn a{color:#6B4E00 !important;font-weight:600}
.ssm textarea#ssm-notes{width:100%;font-family:var(--ssm-body);font-size:14px;color:var(--ssm-ink);border:1px solid var(--ssm-line);border-radius:0;padding:10px 12px;resize:vertical;background:#fff}
.ssm textarea#ssm-notes:focus{border-color:var(--ssm-black);outline:none}

.ssm-actions{display:flex;gap:14px;align-items:stretch;margin:4px 0 16px}
.ssm-qty{display:flex;align-items:stretch;border:1px solid var(--ssm-line);background:#fff}
.ssm-qty button{width:40px;border:0;background:transparent;font-size:20px;cursor:pointer;color:var(--ssm-black)}
.ssm-qty input{width:44px;border:0 !important;text-align:center;font-size:16px;font-weight:600;color:var(--ssm-ink);background:transparent;padding:0 !important;-moz-appearance:textfield}
.ssm-qty input::-webkit-outer-spin-button,.ssm-qty input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}
.ssm-add{flex:1;display:flex;align-items:center;justify-content:center;gap:12px;font-family:var(--ssm-btn);font-size:16px;letter-spacing:3px;text-transform:uppercase;color:#fff;background:var(--ssm-black);border:0;border-radius:0;padding:15px 18px;cursor:pointer}
.ssm-add:hover{background:var(--ssm-hover)}
.ssm-add:disabled{opacity:.5;cursor:not-allowed}
.ssm-pill{background:rgba(255,255,255,.2);padding:3px 10px;letter-spacing:1px;font-size:15px}

.ssm-delivery{display:flex;gap:12px;align-items:flex-start;margin:0 0 18px;padding:14px 16px;background:var(--ssm-cream);border-left:3px solid var(--ssm-black);font-size:14px;line-height:1.55}
.ssm-delivery svg{flex:none;color:var(--ssm-black);margin-top:2px}
.ssm-delivery strong{color:var(--ssm-ink)}
.ssm-features{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px 16px}
.ssm-features li{position:relative;padding-left:22px;font-size:14.5px;color:var(--ssm-ink)}
.ssm-features li::before{content:"✓";position:absolute;left:0;color:var(--ssm-green);font-weight:700}

/* ---------- story sections ---------- */
.ssm-banner{position:relative;min-height:520px;display:flex;align-items:flex-end;background:#2b2520 center/cover no-repeat;color:#fff;margin:10px 0 0}
.ssm-banner::before{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(0,0,0,.62) 0%,rgba(0,0,0,.15) 55%,rgba(0,0,0,0) 100%)}
.ssm-banner .ssm-wrap{position:relative;width:100%;padding-bottom:54px}
.ssm-banner h2{color:#fff;font-size:clamp(30px,4.2vw,50px);max-width:640px}
.ssm-banner p{max-width:540px;font-size:17px;color:rgba(255,255,255,.88)}
.ssm-banner .ssm-kicker{color:rgba(255,255,255,.75)}

.ssm-craft{padding-top:70px;padding-bottom:70px}
.ssm-craft-head{display:flex;justify-content:space-between;align-items:flex-end;gap:20px;flex-wrap:wrap;margin-bottom:24px}
.ssm-craft-head p{max-width:560px;margin:0 !important}
.ssm-craft-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px}
.ssm-craft-grid figure{margin:0}
.ssm-craft-grid img{width:100%;aspect-ratio:3/4;object-fit:cover;display:block}
.ssm-craft-grid figcaption{padding:12px 0 0}
.ssm-craft-grid figcaption strong{display:block;font-family:var(--ssm-head);font-size:19px;font-weight:500;color:var(--ssm-ink)}
.ssm-craft-grid figcaption span{font-size:14px}

.ssm-woodcmp{background:var(--ssm-cream);padding:70px 0}
.ssm-woodcmp-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:26px;margin-top:26px}
.ssm-wcard{background:#fff;display:grid;grid-template-columns:44% 1fr;min-height:300px}
.ssm-wcard.current{outline:2px solid var(--ssm-black)}
.ssm-wcard img{width:100%;height:100%;object-fit:cover;display:block}
.ssm-wcard > div{padding:26px 26px 22px;display:flex;flex-direction:column}
.ssm-wcard ul{margin:0 0 18px !important}
.ssm-wcard li{font-size:14.5px;color:var(--ssm-ink);padding-left:16px;position:relative}
.ssm-wcard li::before{content:"·";position:absolute;left:4px;font-weight:700}
.ssm-wcard .ssm-cfrom{font-family:var(--ssm-head);font-size:24px;color:var(--ssm-black);margin-top:auto}
.ssm-wcard .ssm-cfrom small{font-family:var(--ssm-body);font-size:13px;color:var(--ssm-soft)}
.ssm-wcard .ssm-btn{margin-top:12px;align-self:flex-start}

.ssm-details{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);gap:52px;padding:70px 0 40px;align-items:start}
.ssm-measure{display:grid;grid-template-columns:190px 1fr;gap:22px;align-items:center;margin:22px 0 0;padding:20px;border:1px solid var(--ssm-rule)}
.ssm-measure svg{width:100%;height:auto}
.ssm-measure p{font-size:14px;margin:0 !important}
.ssm-more{border-top:1px solid var(--ssm-rule);margin-top:18px}
.ssm-more summary{cursor:pointer;font-weight:600;color:var(--ssm-ink);padding:14px 0}
.ssm-more div{font-size:14px}
.ssm-specs{background:var(--ssm-cream);padding:24px 26px;margin:0;display:grid;grid-template-columns:1fr auto;gap:10px 18px;font-size:14.5px}
.ssm-specs dt{color:var(--ssm-soft)}
.ssm-specs dd{margin:0;font-weight:600;color:var(--ssm-ink);text-align:right}

.ssm-faq{max-width:860px;padding:10px 0 80px}
.ssm-faq details{border-bottom:1px solid var(--ssm-rule);padding:4px 0}
.ssm-faq summary{cursor:pointer;font-weight:600;color:var(--ssm-ink);padding:14px 0;list-style:none;display:flex;justify-content:space-between;gap:14px}
.ssm-faq summary::-webkit-details-marker{display:none}
.ssm-faq summary::after{content:"+";font-size:22px;color:var(--ssm-black);line-height:1}
.ssm-faq details[open] summary::after{content:"−"}
.ssm-a{padding:0 0 16px;max-width:720px}

.ssm-bespoke{background:var(--ssm-black);color:#cfcfcf;padding:56px 0}
.ssm-bespoke .ssm-wrap{display:flex;justify-content:space-between;align-items:center;gap:24px;flex-wrap:wrap}
.ssm-bespoke h2{color:#fff}
.ssm-bespoke p{margin:0 !important;max-width:600px}

.ssm-lightbox{display:none;position:fixed;inset:0;z-index:100000;background:rgba(10,10,10,.93);align-items:center;justify-content:center}
.ssm-lightbox.open{display:flex}
.ssm-lightbox img{max-width:min(92vw,1100px);max-height:88vh;object-fit:contain}
.ssm-lb-close,.ssm-lb-nav{position:absolute;width:46px;height:46px;border-radius:50%;border:0;background:rgba(255,255,255,.14);color:#fff;font-size:24px;cursor:pointer;line-height:1}
.ssm-lb-close{top:18px;right:20px}
.ssm-lb-nav{top:50%;transform:translateY(-50%)}
.ssm-lb-prev{left:14px}
.ssm-lb-next{right:14px}

@media (prefers-reduced-motion:reduce){.ssm-hero-media img,.ssm-hero-cue::after{animation:none}}

@media (max-width:980px){
  .ssm-pdp,.ssm-details{grid-template-columns:1fr;gap:26px}
  .ssm-gallery{position:static;width:100%;max-width:576px;margin:0 auto}
  .ssm-craft-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .ssm-woodcmp-grid{grid-template-columns:1fr}
}
@media (max-width:760px){
  .ssm-hero{height:auto;min-height:min(86svh,720px)}
  .ssm-hero-shade{background:linear-gradient(0deg,rgba(10,7,5,.9) 0%,rgba(10,7,5,.55) 45%,rgba(10,7,5,.05) 75%)}
  .ssm-hero-in{padding-top:180px;padding-bottom:30px}
  .ssm-hero-line{font-size:16px}
  .ssm-hero-btns .ssm-btn{flex:1}
  .ssm-hero-facts{margin-top:28px !important}
  .ssm-hero-facts li{padding:12px 8px 0 0}
  .ssm-hero-facts li+li{padding-left:10px}
  .ssm-hero-facts strong{font-size:22px;white-space:nowrap}
  .ssm-hero-facts span{font-size:11.5px}
  .ssm-hero-cue{display:none}
}
@media (max-width:600px){
  .ssm-wrap{padding-left:16px;padding-right:16px}
  .ssm-price{font-size:30px}
  .ssm-wood{padding:8px;gap:8px}
  .ssm-wood img{width:44px;height:44px}
  .ssm-wood small{display:none}
  .ssm-features{grid-template-columns:1fr}
  .ssm-add{letter-spacing:1.5px;font-size:13px;gap:8px;padding:13px 10px;white-space:nowrap}
  .ssm-banner{min-height:420px}
  .ssm-wcard{grid-template-columns:1fr}
  .ssm-wcard img{aspect-ratio:4/3}
  .ssm-measure{grid-template-columns:1fr}
  .ssm-measure svg{max-width:200px}
}
