/* Project Timber — home page styles (loaded after base.css). */
:root{
    --ink:#211E24; --charcoal:#3B333D; --slate:#5A5560; --graphite:#6E6A74;
    --clay:#B7997F; --sand:#E6D9C7; --stone:#CFC0AC;
    --paper:#F5F5F5; --mist:#F5F5F5; --white:#FFFFFF;
    --accent:#FFFF00;
    --txt:#211E24; --txt-soft:#6E6A74; --on-dark:#F7F4EF; --on-dark-soft:#B7B2BB;
    --r:26px; --r-sm:16px; --maxw:1180px;
    --ease:cubic-bezier(.2,.7,.3,1);
    --e1:0 1px 2px rgba(33,30,36,.06), 0 6px 16px rgba(33,30,36,.06);
    --e2:0 2px 6px rgba(33,30,36,.08), 0 18px 40px rgba(33,30,36,.10);
    --e3:0 10px 30px rgba(33,30,36,.14), 0 30px 70px rgba(33,30,36,.16);
    --font:"F37 Jagger","Trebuchet MS","Segoe UI",system-ui,sans-serif;
  }
  
  
  
  h1,h2,h3,h4{ font-weight:700; line-height:1.02; letter-spacing:-.02em; margin:0; }
  
  
  
  .eyebrow{ font-weight:400; text-transform:uppercase; letter-spacing:.22em; font-size:.7rem; color:var(--txt-soft); }
  .lead{ font-weight:300; font-size:1.18rem; color:var(--txt-soft); line-height:1.5; }
  @media(min-width:860px){ .lead{ font-size:1.4rem; } }
  section{ padding:64px 0; }
  .sec-head{ margin-bottom:30px; }
  .sec-head h2{ font-size:clamp(2rem,5vw,3rem); }
  .fade{ background:linear-gradient(100deg,var(--charcoal) 35%,#767181); -webkit-background-clip:text; background-clip:text; color:transparent; }
  .swipe{ position:relative; white-space:nowrap; }
  .swipe::after{ content:""; position:absolute; left:-.06em; right:-.06em; bottom:.08em; height:.30em; background:rgba(255,255,0,.3); z-index:-1; transform:rotate(-1.5deg); }

  /* buttons */
  .btn-primary{ display:inline-flex; align-items:center; gap:8px; border:none; cursor:pointer; text-decoration:none; font-family:var(--font); font-weight:700; background:var(--accent); color:var(--ink); font-size:1rem; padding:15px 28px; border-radius:999px; box-shadow:var(--e1); transition:transform .2s var(--ease), box-shadow .2s var(--ease); }
  .btn-primary:active{ transform:scale(.98); }
  @media(hover:hover){ .btn-primary:hover{ transform:translateY(-2px); box-shadow:var(--e2); } .btn-primary:hover .a{ transform:translateX(4px); } }
  .btn-primary .a{ transition:transform .25s var(--ease); }
  .btn-ghost{ display:inline-flex; align-items:center; gap:8px; border:1.5px solid currentColor; cursor:pointer; text-decoration:none; font-family:var(--font); font-weight:700; background:transparent; color:inherit; font-size:1rem; padding:13.5px 26px; border-radius:999px; transition:transform .2s var(--ease); }
  .btn-ghost:active{ transform:scale(.98); }

  /* promo + header */
  /* .skip moved to base.css — it's site-wide chrome (the header loads on every page). */
  :focus-visible{ outline:2px solid var(--charcoal); outline-offset:2px; border-radius:6px; }
  
  
  .mainhead{ display:flex; align-items:center; gap:14px; padding:10px 20px; border-bottom:1px solid rgba(33,30,36,.07); position:sticky; top:0; z-index:50; background:rgba(255,255,255,.82); backdrop-filter:saturate(160%) blur(18px); -webkit-backdrop-filter:saturate(160%) blur(18px); }
  
  
  
   
  
  
  
  
  
  /* header search bar (opens under the nav) */
  
  
  
  
  
  /* mobile header: logo centred · cart+account left · search+burger right · chat hidden */
  
  
   
  
  
  
  
  
  @media(hover:hover){ .primnav a:hover{ color:#000; } }
  

  /* hero */
  .hero{ position:relative; min-height:clamp(520px,78vh,760px); display:flex; align-items:flex-end; overflow:hidden; color:#fff; }
  .hero img, .hero video{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
  .hero .hero-vtoggle{ position:absolute; right:16px; bottom:16px; z-index:3; width:40px; height:40px; border-radius:50%; border:1px solid rgba(255,255,255,.5); background:rgba(0,0,0,.35); -webkit-backdrop-filter:blur(6px); backdrop-filter:blur(6px); color:#fff; cursor:pointer; display:flex; align-items:center; justify-content:center; }
  .hero .hero-vtoggle svg{ width:18px; height:18px; }
  .hero .hero-vtoggle .ipl{ display:none; }
  .hero .hero-vtoggle.paused .ip{ display:none; } .hero .hero-vtoggle.paused .ipl{ display:block; }
  .hero .scrim{ position:absolute; inset:0; background:linear-gradient(180deg,rgba(0,0,0,.12) 0%,rgba(0,0,0,.18) 45%,rgba(0,0,0,.66)); }
  .hero .inner{ position:relative; padding:0 20px 56px; max-width:var(--maxw); margin:0 auto; width:100%; }
  .hero .eyebrow{ color:#fff; opacity:.85; }
  .hero h1{ font-size:clamp(2.4rem,6.5vw,4.6rem); letter-spacing:-.035em; line-height:1; margin:14px 0 16px; max-width:16ch; text-shadow:0 2px 30px rgba(0,0,0,.25); }
  .hero .sub{ font-weight:300; font-size:clamp(1.05rem,2.4vw,1.4rem); max-width:54ch; color:#f3f1ee; }
  .hero .cta-row{ display:flex; gap:12px; flex-wrap:wrap; margin-top:26px; }

  /* trust bar */
  .trustbar{ background:var(--charcoal); color:var(--on-dark); padding:20px 0; }
  .trustbar .wrap{ display:flex; flex-wrap:wrap; gap:12px 26px; justify-content:center; align-items:center; }
  .trustbar .ti{ display:inline-flex; align-items:center; gap:9px; font-size:.84rem; font-weight:400; }
  .trustbar .ti svg{ width:16px; height:16px; flex:0 0 auto; color:var(--accent); }

  /* shop by range */
  .ranges{ background:var(--paper); }
  .range-grid{ display:grid; gap:14px; grid-template-columns:repeat(2,1fr); }
  @media(min-width:680px){ .range-grid{ gap:16px; } }
  @media(min-width:1000px){ .range-grid{ grid-template-columns:repeat(3,1fr); } }
  .range-card{ position:relative; display:block; border-radius:var(--r-sm); overflow:hidden; text-decoration:none; color:#fff; box-shadow:var(--e1); aspect-ratio:5/4; transition:transform .25s var(--ease), box-shadow .25s var(--ease); }
  .range-card:active{ transform:scale(.99); }
  @media(hover:hover){ .range-card:hover{ transform:translateY(-4px); box-shadow:var(--e2); } }
  .range-card img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; display:block; transition:transform .6s var(--ease); }
  @media(hover:hover){ .range-card:hover img{ transform:scale(1.06); } }
  .range-card::after{ content:""; position:absolute; inset:0; background:linear-gradient(180deg,rgba(0,0,0,0) 38%,rgba(0,0,0,.62)); pointer-events:none; }
  .range-card .glass{ position:absolute; left:12px; right:12px; bottom:12px; z-index:1; padding:14px 16px; border-radius:14px; background:rgba(255,255,255,.16); backdrop-filter:blur(16px) saturate(150%); -webkit-backdrop-filter:blur(16px) saturate(150%); border:1px solid rgba(255,255,255,.3); box-shadow:0 8px 24px rgba(0,0,0,.16); }
  .rfoot{ margin-top:10px; display:flex; align-items:center; justify-content:space-between; gap:10px; }
  .rfoot .rprice{ font-weight:700; color:#fff; font-size:.9rem; white-space:nowrap; }
  .range-card .rfoot .more, .rb-in .rfoot .shop{ margin-top:0; }
  .range-card h3{ font-size:1.08rem; color:#fff; text-shadow:0 1px 10px rgba(0,0,0,.3); }
  .range-card .d{ font-weight:300; font-size:.8rem; color:rgba(255,255,255,.9); line-height:1.4; margin-top:4px; text-shadow:0 1px 8px rgba(0,0,0,.3); }
  .range-card .more{ font-weight:700; font-size:.78rem; letter-spacing:.04em; color:#fff; display:inline-flex; align-items:center; gap:6px; margin-top:9px; }
  .range-card .more .a{ transition:transform .25s var(--ease); }
  @media(hover:hover){ .range-card:hover .more .a{ transform:translateX(4px); } }
  /* mobile only: 2-col, text directly on the image (no glass box) */
  @media(max-width:679px){
    .range-card{ aspect-ratio:4/5; }
    .range-card::after{ background:linear-gradient(180deg,rgba(0,0,0,0) 40%,rgba(0,0,0,.74)); }
    .range-card .glass{ left:0; right:0; bottom:0; padding:14px 15px; background:none; border:none; box-shadow:none; -webkit-backdrop-filter:none; backdrop-filter:none; border-radius:0; }
    .range-card .glass .d{ display:none; }
    .range-card h3{ font-size:1.05rem; }
    .rfoot{ margin-top:8px; }
    .range-card .more{ font-size:0; }
    .range-card .more .a{ font-size:1.05rem; }
  }

  /* why grid */
  .wc-grid{ display:grid; gap:16px; grid-template-columns:1fr; }
  @media(min-width:560px){ .wc-grid{ grid-template-columns:1fr 1fr; } }
  @media(min-width:900px){ .wc-grid{ grid-template-columns:repeat(3,1fr); gap:18px; } }
  .wc-card{ background:var(--white); border:1px solid rgba(33,30,36,.1); border-radius:var(--r-sm); padding:24px; box-shadow:var(--e1); transition:box-shadow .25s var(--ease), transform .25s var(--ease); }
  @media(hover:hover){ .wc-card:hover{ box-shadow:var(--e2); transform:translateY(-3px); } }
  .wc-card .ic{ width:46px; height:46px; border-radius:12px; background:var(--mist); display:flex; align-items:center; justify-content:center; margin-bottom:14px; }
  .wc-card .ic svg{ width:24px; height:24px; }
  .wc-card h3{ font-size:1.12rem; margin-bottom:6px; line-height:1.1; }
  .wc-card p{ font-weight:300; font-size:.9rem; color:var(--txt-soft); line-height:1.45; }

  /* immerse (full-bleed) */
  .immerse{ position:relative; background:var(--ink); color:var(--on-dark); overflow:hidden; height:100vh; height:100dvh; display:flex; flex-direction:column; justify-content:flex-end; }
  .immerse img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; display:block; }
  .immerse .panel{ position:relative; z-index:1; width:min(90%,680px); margin:0 auto 6%; background:rgba(33,30,36,.55); backdrop-filter:blur(16px); -webkit-backdrop-filter:blur(16px); border:1px solid rgba(255,255,255,.14); border-radius:var(--r); padding:26px 28px; text-align:center; box-shadow:var(--e3); }
  .immerse .panel h2{ font-size:clamp(1.5rem,3.6vw,2.4rem); margin-bottom:10px; }
  .immerse .panel p{ font-weight:300; color:var(--on-dark-soft); margin-bottom:18px; }
  @media(max-width:680px){
    .immerse .panel{ width:auto; margin:0 20px 20px; padding:22px 22px; }
  }

  /* use tiles */
  .uses{ background:var(--mist); }
  .use-grid{ display:grid; gap:14px; grid-template-columns:repeat(2,1fr); }
  @media(min-width:760px){ .use-grid{ grid-template-columns:repeat(3,1fr); gap:16px; } }
  .use-tile{ display:block; text-decoration:none; color:inherit; background:var(--white); border-radius:var(--r-sm); padding:0; overflow:hidden; box-shadow:var(--e1); transition:transform .2s var(--ease), box-shadow .2s var(--ease); }
  @media(hover:hover){ .use-tile:hover{ transform:translateY(-3px); box-shadow:var(--e2); } }
  /* interactive explore module */
  .exp-tabs{ display:flex; flex-wrap:wrap; gap:6px; background:var(--mist); border-radius:999px; padding:6px; margin:24px 0 4px; }
  .exp-tab{ flex:1 1 auto; border:none; background:none; cursor:pointer; font-family:var(--font); font-weight:700; font-size:.92rem; color:var(--txt-soft); padding:13px 18px; border-radius:999px; white-space:nowrap; transition:background .2s var(--ease), color .2s; }
  .exp-tab[aria-selected="true"]{ background:var(--charcoal); color:#fff; }
  @media(hover:hover){ .exp-tab:not([aria-selected="true"]):hover{ color:var(--ink); } }
  /* mobile: keep pills on one row and let them swipe horizontally */
  @media(max-width:640px){
    .exp-tabs{ flex-wrap:nowrap; overflow-x:auto; -webkit-overflow-scrolling:touch; scrollbar-width:none; scroll-snap-type:x proximity; }
    .exp-tabs::-webkit-scrollbar{ display:none; }
    .exp-tab{ flex:0 0 auto; scroll-snap-align:start; }
  }
  .exp-panel[hidden]{ display:none; }
  .exp-panel{ margin-top:16px; }
  .use-tile::before{ content:"Scenario image"; display:flex; align-items:flex-end; aspect-ratio:16/10; padding:12px 14px; font-size:.66rem; font-weight:700; letter-spacing:.05em; text-transform:uppercase; color:#9a95a0; background:var(--mist) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='40' height='40' viewBox='0 0 24 24' fill='none' stroke='%23B7B2BB' stroke-width='1.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='4' width='18' height='16' rx='2'/%3E%3Ccircle cx='8.5' cy='9.5' r='1.5'/%3E%3Cpath d='M21 15l-5-5L5 20'/%3E%3C/svg%3E") center 42% / 40px no-repeat; }
  .use-tile h3{ font-size:1.06rem; margin:15px 18px 5px; display:flex; align-items:center; gap:9px; }
  .use-tile h3 svg{ width:20px; height:20px; color:var(--charcoal); flex:0 0 auto; }
  .use-tile p{ font-weight:300; font-size:.86rem; color:var(--txt-soft); line-height:1.4; margin:0 18px 18px; }
  .use-tile .uimg{ display:block; width:100%; aspect-ratio:16/10; object-fit:cover; transition:transform .5s var(--ease); }
  .use-tile:has(.uimg)::before{ display:none; }
  @media(hover:hover){ .use-tile:hover .uimg{ transform:scale(1.05); } }

  /* tiers */
  .tiers .grid{ display:grid; gap:18px; grid-template-columns:1fr; }
  @media(min-width:860px){ .tiers .grid{ grid-template-columns:repeat(3,1fr); } }
  .tier{ position:relative; background:var(--white); border:1px solid rgba(33,30,36,.12); border-radius:var(--r); padding:28px 26px; box-shadow:var(--e1); display:flex; flex-direction:column; }
  .tier.feat{ border:2px solid var(--charcoal); }
  .tier .tag{ position:absolute; top:-12px; left:26px; background:var(--accent); color:var(--ink); font-size:.66rem; font-weight:700; letter-spacing:.08em; text-transform:uppercase; padding:4px 12px; border-radius:999px; }
  .tier .name{ font-size:1.4rem; font-weight:700; }
  .tier .pos{ font-weight:300; font-size:.82rem; color:var(--txt-soft); margin:2px 0 14px; }
  .tier ul{ list-style:none; margin:0 0 20px; padding:0; display:grid; gap:9px; }
  .tier li{ display:flex; gap:9px; align-items:flex-start; font-size:.9rem; font-weight:300; }
  .tier li svg{ width:18px; height:18px; flex:0 0 auto; margin-top:1px; }
  .tier .btn-primary,.tier .btn-ghost{ margin-top:auto; justify-content:center; }

  /* split */
  .split .grid{ display:grid; gap:28px; align-items:center; }
  @media(min-width:860px){ .split .grid{ grid-template-columns:1fr 1fr; gap:56px; } .split.rev .media{ order:2; } }
  .split .media img{ width:100%; border-radius:var(--r); box-shadow:var(--e2); display:block; aspect-ratio:4/3; object-fit:cover; background:var(--mist); }
  .split h2{ font-size:clamp(1.9rem,4.6vw,2.8rem); margin-bottom:14px; }
  .split .copy > p{ font-weight:300; color:var(--txt-soft); line-height:1.6; margin-bottom:14px; }
  .split .statrow{ display:flex; gap:32px; margin-top:22px; flex-wrap:wrap; }
  .split .statrow .n{ font-size:1.9rem; font-weight:700; color:var(--charcoal); line-height:1; }
  .split .statrow .l{ font-weight:300; font-size:.8rem; color:var(--txt-soft); margin-top:5px; }

  /* showsite visit */
  .showsite{ background:var(--paper); }
  .ss-grid{ display:grid; gap:26px; grid-template-columns:1fr; align-items:center; }
  @media(min-width:860px){ .ss-grid{ grid-template-columns:1.05fr .95fr; gap:44px; } }
  .ss-media{ display:grid; grid-template-columns:1fr 1fr; gap:12px; }
  .ss-ph{ position:relative; border-radius:var(--r-sm); overflow:hidden; box-shadow:var(--e1); background:repeating-linear-gradient(45deg,#e7e5e0,#e7e5e0 12px,#efede8 12px,#efede8 24px); display:flex; flex-direction:column; align-items:center; justify-content:center; gap:8px; color:#8b8690; text-align:center; padding:14px; }
  .ss-ph svg{ width:30px; height:30px; opacity:.6; } .ss-ph span{ font-size:.68rem; font-weight:700; letter-spacing:.04em; }
  .ss-ph img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
  .ss-ph-a{ grid-column:1 / -1; aspect-ratio:16/10; } .ss-ph-b,.ss-ph-c{ aspect-ratio:1/1; }
  .ss-copy h2{ font-size:clamp(1.9rem,4.5vw,2.8rem); line-height:1.03; }
  .ss-copy > p{ font-weight:300; color:var(--txt-soft); line-height:1.55; margin:14px 0 18px; max-width:46ch; }
  .ss-points{ list-style:none; display:grid; gap:11px; margin:0 0 24px; }
  .ss-points li{ display:flex; align-items:flex-start; gap:10px; font-size:.92rem; font-weight:300; color:var(--txt); }
  .ss-points li svg{ width:18px; height:18px; color:var(--charcoal); flex:0 0 auto; margin-top:2px; }
  .ss-note{ font-size:.82rem; color:var(--txt-soft); margin-top:14px; }

  /* booking modal */
  .book{ position:fixed; inset:0; z-index:200; display:none; }
  .book.open{ display:block; }
  .book-back{ position:absolute; inset:0; background:rgba(20,18,22,.55); -webkit-backdrop-filter:blur(4px); backdrop-filter:blur(4px); opacity:0; transition:opacity .25s var(--ease); }
  .book.open .book-back{ opacity:1; }
  .book-panel{ position:absolute; left:50%; top:50%; transform:translate(-50%,-47%); width:min(94vw,560px); max-height:90vh; overflow-y:auto; background:var(--white); border-radius:var(--r); box-shadow:var(--e3); padding:26px 26px 28px; opacity:0; transition:opacity .25s var(--ease), transform .25s var(--ease); }
  .book.open .book-panel{ opacity:1; transform:translate(-50%,-50%); }
  .book-x{ position:absolute; top:14px; right:14px; width:38px; height:38px; border-radius:50%; border:none; background:var(--mist); color:var(--ink); font-size:1.35rem; line-height:1; cursor:pointer; display:flex; align-items:center; justify-content:center; }
  .book-head h3{ font-size:1.5rem; margin:4px 0 6px; } .book-head p{ font-weight:300; font-size:.9rem; color:var(--txt-soft); line-height:1.45; }
  .book-body{ margin-top:18px; }
  .cal-head{ display:flex; align-items:center; justify-content:space-between; margin-bottom:12px; }
  .cal-title{ font-weight:700; font-size:1.02rem; }
  .cal-nav{ width:36px; height:36px; border-radius:10px; border:1px solid rgba(33,30,36,.14); background:var(--white); cursor:pointer; font-size:1.1rem; color:var(--ink); }
  .cal-nav[disabled]{ opacity:.3; cursor:default; }
  .cal-dow{ display:grid; grid-template-columns:repeat(7,1fr); gap:6px; margin-bottom:6px; }
  .cal-dow span{ text-align:center; font-size:.66rem; font-weight:700; letter-spacing:.04em; color:var(--txt-soft); text-transform:uppercase; }
  .cal-grid{ display:grid; grid-template-columns:repeat(7,1fr); gap:6px; }
  .cal-cell{ aspect-ratio:1/1; border:none; background:var(--mist); border-radius:10px; cursor:pointer; font-family:var(--font); font-weight:700; font-size:.9rem; color:var(--ink); display:flex; align-items:center; justify-content:center; transition:background .15s var(--ease); }
  .cal-cell.empty{ background:none; cursor:default; }
  .cal-cell[disabled]{ color:rgba(33,30,36,.24); cursor:default; }
  @media(hover:hover){ .cal-cell:not([disabled]):not(.empty):hover{ background:#e7e4df; } }
  .cal-cell.sel{ background:var(--charcoal); color:#fff; }
  .slots{ margin-top:20px; } .slots-lbl{ font-size:.82rem; font-weight:400; color:var(--txt-soft); margin-bottom:10px; } .slots-lbl b{ color:var(--ink); font-weight:700; }
  .slot-list{ display:grid; grid-template-columns:repeat(3,1fr); gap:8px; }
  .slot{ border:1px solid rgba(33,30,36,.14); background:var(--white); border-radius:10px; padding:11px 6px; cursor:pointer; font-family:var(--font); font-weight:700; font-size:.86rem; color:var(--ink); transition:border-color .15s, background .15s; }
  @media(hover:hover){ .slot:hover{ border-color:var(--charcoal); } }
  .slot.sel{ background:var(--charcoal); color:#fff; border-color:var(--charcoal); }
  .book-form{ margin-top:20px; display:grid; gap:12px; }
  .book-sum{ background:var(--mist); border-radius:12px; padding:12px 14px; font-size:.88rem; font-weight:300; color:var(--txt); } .book-sum b{ font-weight:700; color:var(--ink); }
  .book-form label{ display:flex; flex-direction:column; gap:5px; font-size:.72rem; font-weight:700; letter-spacing:.05em; text-transform:uppercase; color:var(--txt-soft); }
  .book-form input{ font-family:var(--font); font-size:.95rem; padding:12px 14px; border:1px solid rgba(33,30,36,.16); border-radius:12px; background:var(--white); color:var(--ink); }
  .book-form input:focus-visible{ outline:2px solid var(--charcoal); outline-offset:1px; }
  .book-form .btn-primary{ justify-content:center; margin-top:4px; }
  .book-done{ text-align:center; padding:16px 6px 6px; }
  .book-done .tick{ width:52px; height:52px; border-radius:50%; background:var(--accent); color:var(--ink); display:flex; align-items:center; justify-content:center; margin:0 auto 14px; font-size:1.5rem; font-weight:700; }
  .book-done h3{ font-size:1.3rem; margin-bottom:6px; } .book-done p{ font-weight:300; color:var(--txt-soft); font-size:.9rem; line-height:1.5; }
  .book-done .btn-primary{ margin-top:18px; justify-content:center; }

  /* reviews */
  .trust{ background:var(--paper); text-align:center; }
  .trust .g{ display:inline-flex; align-items:center; gap:10px; font-weight:700; font-size:.8rem; text-transform:uppercase; letter-spacing:.14em; color:#fff; background:var(--charcoal); padding:9px 16px; border-radius:999px; }
  .trust h2{ font-size:clamp(2rem,5vw,3.2rem); margin:22px 0 8px; }
  .reviews{ display:grid; grid-template-columns:1fr; gap:16px; margin-top:34px; }
  @media(min-width:680px){ .reviews{ grid-template-columns:repeat(3,1fr); } }
  .review{ background:var(--white); border-radius:var(--r-sm); box-shadow:var(--e1); padding:22px; text-align:left; }
  .review .stars{ letter-spacing:2px; color:var(--charcoal); font-weight:700; }
  .review p{ font-weight:300; font-size:.95rem; margin:10px 0; }
  .review .by{ font-size:.8rem; color:var(--txt-soft); }

  /* callback */
  .callback{ position:relative; overflow:hidden; color:var(--on-dark); text-align:center;
    background:radial-gradient(rgba(255,255,255,.05) 1px, transparent 1px) 0 0/18px 18px,
              linear-gradient(115deg,#3B333D 0%,#9E88A3 100%); }
  .callback::after{ content:""; position:absolute; right:-90px; top:-100px; width:340px; height:340px; border-radius:50%; background:radial-gradient(circle, rgba(255,255,255,.14), transparent 70%); pointer-events:none; }
  .callback .wrap{ position:relative; z-index:1; }
  .callback h2{ font-size:clamp(1.9rem,5vw,2.8rem); }
  .callback p{ font-weight:300; color:var(--on-dark-soft); max-width:48ch; margin:10px auto 24px; }
  .callback .row{ display:flex; gap:12px; justify-content:center; flex-wrap:wrap; align-items:center; }
  .callback .phone{ font-weight:700; font-size:1.1rem; color:#fff; text-decoration:none; }

  /* faq */
  .faq .wrap{ max-width:820px; }
  .faq h2{ font-size:clamp(2rem,5vw,3rem); margin-bottom:24px; text-align:center; }
  .faq-item{ border-bottom:1px solid rgba(33,30,36,.12); }
  .faq-item summary{ list-style:none; cursor:pointer; padding:20px 36px 20px 0; position:relative; font-weight:700; font-size:1.05rem; }
  .faq-item summary::-webkit-details-marker{ display:none; }
  .faq-item summary::after{ content:"+"; position:absolute; right:4px; top:17px; font-weight:300; font-size:1.5rem; color:var(--txt-soft); }
  .faq-item[open] summary::after{ content:"\2013"; }
  .faq-item .ans{ padding:0 36px 22px 0; font-weight:300; color:var(--txt-soft); line-height:1.6; font-size:.95rem; }

  /* final */
  .final{ text-align:center; }
  .final h2{ font-size:clamp(2.2rem,6vw,4rem); margin-bottom:22px; }
  .final .note{ margin-top:16px; font-weight:300; font-size:.82rem; color:var(--txt-soft); }

  /* footer */
  
  
  
  
  
  
  
  
  @media(hover:hover){ .site-foot a:hover{ color:#fff; } }
  
  
  
  
  
  
  
  

  /* support widget */
  
  .support{ position:fixed; left:18px; bottom:18px; z-index:200; }
  
  
   
    
   
   
  
  .support .panel{ position:absolute; left:0; bottom:70px; width:300px; max-width:calc(100vw - 36px); max-height:calc(100vh - 170px); overflow-y:auto; background:var(--accent); color:var(--charcoal); border-radius:22px; box-shadow:var(--e3); padding:22px 20px 18px; opacity:0; transform:translateY(10px) scale(.98); transform-origin:0 100%; pointer-events:none; transition:opacity .25s var(--ease), transform .25s var(--ease); }
  
  
  
  
  
  
   
  @media(hover:hover){ .support .opt:hover{ background:#F6F4D6; } }

  
  /* why-us bento (built better) — fully tiled */
  .whyb-grid{ display:grid; gap:14px; grid-template-columns:1fr 1fr; }
  .whyb-cell{ position:relative; border-radius:var(--r-sm); overflow:hidden; padding:22px; display:flex; flex-direction:column; justify-content:flex-end; box-shadow:var(--e1); min-height:120px; }
  /* mobile + tablet: full-width hero + statement, then insulation half-width with pressure-treated & framing beside it */
  .whyb-a{ grid-column:1 / -1; aspect-ratio:6/5; }
  .whyb-b{ grid-column:1 / -1; }
  .whyb-c{ grid-column:1; grid-row:span 2; }
  @media(min-width:900px){
    .whyb-grid{ grid-template-columns:repeat(4,1fr); grid-auto-rows:176px; grid-auto-flow:dense; gap:16px; }
    .whyb-cell{ min-height:0; }
    .whyb-a{ grid-column:span 2; grid-row:span 3; aspect-ratio:auto; }
    .whyb-b{ grid-column:span 2; }
    .whyb-c{ grid-column:auto; grid-row:span 2; aspect-ratio:auto; }
  }
  .whyb-photo{ color:#fff; } .whyb-photo img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; transition:transform .6s var(--ease); }
  .whyb-photo .ph{ position:absolute; inset:0; background:repeating-linear-gradient(45deg,#e7e5e0,#e7e5e0 12px,#efede8 12px,#efede8 24px); display:flex; flex-direction:column; align-items:center; justify-content:center; gap:8px; color:var(--slate); text-align:center; padding:16px; }
  .whyb-photo .ph svg{ width:32px; height:32px; opacity:.6; } .whyb-photo .ph .cap{ font-size:.7rem; font-weight:700; max-width:24ch; line-height:1.3; }
  .whyb-photo::after{ content:""; position:absolute; inset:0; background:linear-gradient(180deg,rgba(0,0,0,0) 40%,rgba(0,0,0,.72)); }
  .whyb-photo .in{ position:relative; z-index:1; }
  .whyb-dark{ background:linear-gradient(150deg,#211E24,#3B333D); color:#fff; }
  .whyb-accent{ background:rgba(255,255,0,.3); color:var(--ink); }
  .whyb-light{ background:var(--mist); color:var(--txt); }
  .whyb-cell .lab{ font-size:.68rem; text-transform:uppercase; letter-spacing:.14em; font-weight:700; opacity:1; margin-bottom:7px; color:#B7997F; }
  .whyb-cell .big{ font-size:1.6rem; font-weight:700; line-height:1.08; }
  .whyb-cell h3{ font-size:1.12rem; margin-bottom:5px; line-height:1.1; }
  .whyb-cell p{ font-weight:300; font-size:.85rem; line-height:1.4; color:inherit; opacity:.9; }
  .whyb-light p{ color:var(--txt-soft); opacity:1; } .whyb-accent p{ color:var(--ink); opacity:.85; }
  /* icon + label variants (whyb-b dark stat cell, whyb-feat light feature cells) */
  .whyb-b{ flex-direction:row; align-items:center; justify-content:flex-start; gap:15px; }
  .whyb-b .wb-ic{ flex:0 0 auto; color:#fff; } .whyb-b .wb-ic svg{ width:56px; height:56px; display:block; }
  .whyb-b .wb-txt .big{ font-size:1.5rem; } .whyb-b .wb-txt p{ margin-top:7px; opacity:.82; }
  .whyb-b::after{ content:""; position:absolute; right:-70px; top:-80px; width:250px; height:250px; border-radius:50%; background:radial-gradient(circle, rgba(255,255,255,.055), transparent 70%); pointer-events:none; }
  .whyb-feat{ flex-direction:row; align-items:center; justify-content:flex-start; gap:14px; padding:22px; }
  .whyb-feat .wb-ic{ flex:0 0 auto; color:var(--charcoal); } .whyb-feat .wb-ic svg{ width:52px; height:52px; display:block; }
  .whyb-feat .lab{ margin-bottom:3px; color:#B7997F; opacity:1; }
  .whyb-feat h3{ font-size:1.08rem; margin-bottom:4px; }
  .whyb-feat p{ font-size:.82rem; }
  @media(hover:hover){ .whyb-feat:hover{ transform:translateY(-3px); box-shadow:var(--e2); } }
  @media(hover:hover){ .whyb-cell{ transition:transform .25s var(--ease), box-shadow .25s var(--ease); } .whyb-light:hover, .whyb-photo:hover{ transform:translateY(-3px); box-shadow:var(--e2); } .whyb-photo:hover img{ transform:scale(1.05); } }

  /* ranges bento (one feature + two) */
  .rb-grid{ display:grid; gap:16px; grid-template-columns:1fr; }
  @media(min-width:820px){ .rb-grid{ grid-template-columns:1.3fr 1fr; grid-auto-rows:1fr; } }
  .rb-card{ position:relative; display:block; border-radius:var(--r); overflow:hidden; text-decoration:none; color:#fff; box-shadow:var(--e1); min-height:230px; }
  @media(min-width:820px){ .rb-feat{ grid-row:span 2; } }
  .rb-card img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; transition:transform .6s var(--ease); }
  @media(hover:hover){ .rb-card:hover img{ transform:scale(1.05); } }
  .rb-card::after{ content:""; position:absolute; inset:0; background:linear-gradient(180deg,rgba(0,0,0,.12) 30%,rgba(0,0,0,.68)); }
  .rb-in{ position:absolute; left:0; right:0; bottom:0; z-index:1; padding:24px; }
  .rb-in .tag{ display:inline-block; font-size:.66rem; font-weight:700; letter-spacing:.1em; text-transform:uppercase; padding:5px 11px; border-radius:999px; background:rgba(255,255,255,.92); color:var(--ink); margin-bottom:10px; }
  .rb-in .tag.y{ background:var(--accent); }
  .rb-feat .rb-in h3{ font-size:1.9rem; } .rb-card h3{ font-size:1.35rem; margin:0; }
  .rb-in p{ font-weight:300; font-size:.9rem; color:rgba(255,255,255,.9); margin-top:6px; max-width:34ch; }
  .rb-in .shop{ margin-top:12px; display:inline-flex; align-items:center; gap:7px; font-weight:700; font-size:.88rem; color:#fff; }
  .rb-in .shop .a{ transition:transform .25s var(--ease); } @media(hover:hover){ .rb-card:hover .rb-in .shop .a{ transform:translateX(4px); } }

  /* ===== Cart drawer (shared, namespaced ptc-) ===== */