:root{
    --white:#ffffff; --cream:#f3efe7; --cream-line:#e3ddd0;
    --ink:#0e0e0c; --ink-soft:#3a3934; --ink-faint:#7a786f; --line:#e6e4dd;
    --radius-sm:8px; --radius-md:20px; --radius-lg:28px;
    --max:1240px; --pad:clamp(24px, 5vw, 80px);
    --section-pad:clamp(48px, 6vw, 88px);
    --section-pad-sm:clamp(32px, 4vw, 56px);
  }
  *{box-sizing:border-box; margin:0; padding:0;}
  html{scroll-behavior:smooth;}
  body{font-family:'Inter',-apple-system,BlinkMacSystemFont,sans-serif; color:var(--ink-soft); background:var(--white); -webkit-font-smoothing:antialiased; line-height:1.55;}
  img{max-width:100%; display:block;}
  a{color:inherit; text-decoration:none;}
  ul{list-style:none;}
  button{font-family:inherit; cursor:pointer;}
  :focus-visible{outline:2px solid var(--ink); outline-offset:3px;}
  .wrap{max-width:var(--max); margin:0 auto; padding-left:var(--pad); padding-right:var(--pad);}
  section{padding-top:var(--section-pad); padding-bottom:var(--section-pad);}
  section.tight{padding-top:var(--section-pad-sm); padding-bottom:var(--section-pad-sm);}
  h1,h2,h3{font-family:'Clash Display','Inter',sans-serif; font-weight:500; color:var(--ink); line-height:1.05; letter-spacing:-0.01em;}
  h2{font-size:clamp(30px,3.6vw,48px); max-width:16ch;}
  h3{font-size:clamp(19px,2vw,23px);}
  p{max-width:56ch;}
  .lede{font-size:clamp(16px,1.5vw,18px); color:var(--ink-soft);}
  .placeholder{color:var(--ink-faint); font-style:italic;}
  .center{text-align:center;}
  .center h2, .center .lede{margin-left:auto; margin-right:auto;}
  .eyebrow{font-size:13px; font-weight:700; color:var(--ink-faint); margin-bottom:10px;}

  .btn{display:inline-flex; align-items:center; gap:10px; padding:15px 24px; border-radius:var(--radius-sm); font-weight:700; font-size:15px; white-space:nowrap; transition:transform .15s, background .15s, color .15s;}
  .btn-dark{background:var(--ink); color:var(--white);}
  .btn-dark:hover{transform:translateY(-2px);}
  .btn-light{background:var(--white); color:var(--ink);}
  .btn-outline{background:transparent; color:var(--ink); border:1.5px solid var(--ink);}
  .btn-outline:hover{background:var(--ink); color:var(--white);}
  .btn-sm{padding:11px 18px; font-size:13.5px; border-radius:7px;}
  .btn svg{width:14px; height:14px; flex-shrink:0;}

  /* NAV */
  .nav{position:sticky; top:0; z-index:60; background:rgba(255,255,255,.94); backdrop-filter:blur(8px);}
  .nav .wrap{display:flex; align-items:center; justify-content:space-between; padding-top:18px; padding-bottom:18px;}
  .nav-logo img{height:26px; width:auto;}
  .nav-links{display:flex; align-items:center; gap:30px;}
  .nav-item{position:relative;}
  .nav-item > a, .nav-item > span{display:flex; align-items:center; gap:5px; font-size:14.5px; font-weight:600; color:var(--ink); cursor:default;}
  .nav-item svg{width:9px; height:9px; opacity:.6;}
  .nav-dropdown{position:absolute; top:100%; left:-20px; margin-top:12px; background:var(--white); border:1px solid var(--line); border-radius:14px; box-shadow:0 16px 40px rgba(14,14,12,.1); padding:8px; min-width:230px; opacity:0; visibility:hidden; transform:translateY(6px); transition:opacity .15s, transform .15s, visibility .15s; z-index:5;}
  .nav-item:hover .nav-dropdown{opacity:1; visibility:visible; transform:translateY(0);}
  .nav-dropdown a{display:flex; justify-content:space-between; gap:14px; padding:9px 12px; border-radius:8px; font-size:14px; font-weight:500;}
  .nav-dropdown a:hover{background:var(--cream);}
  .nav-dropdown a span.sz{color:var(--ink-faint); font-weight:500; font-size:12.5px;}
  .nav-right{display:flex; align-items:center; gap:22px;}
  .nav-lang{font-size:13.5px; font-weight:600; display:flex; align-items:center; gap:4px;}
  @media (max-width:900px){ .nav-links{display:none;} .nav-lang{display:none;} }

  /* HERO — full-bleed video */
  .hero{position:relative; height:92vh; min-height:560px; max-height:900px; overflow:hidden; padding:0 !important;}
  .hero video, .hero .hero-fallback{position:absolute; inset:0; width:100%; height:100%; object-fit:cover;}
  .hero::after{content:""; position:absolute; inset:0; background:linear-gradient(0deg, rgba(10,10,8,.74) 0%, rgba(10,10,8,.24) 46%, rgba(10,10,8,.06) 68%);}
  .hero-content{position:absolute; inset:0; z-index:2; display:flex; flex-direction:column; justify-content:flex-end; padding:0 var(--pad) clamp(28px,4vw,52px);}
  .hero-content .inner{max-width:var(--max); margin:0 auto; width:100%;}
  .hero h1{color:var(--white); font-size:clamp(38px,5.6vw,78px); max-width:16ch;}
  .hero-sub{color:rgba(255,255,255,.86); max-width:46ch; margin-top:14px; font-size:clamp(15.5px,1.4vw,18px);}
  .hero-cta-row{display:flex; align-items:center; gap:16px; margin-top:26px; flex-wrap:wrap;}
  .reassure{font-size:12.5px; color:var(--ink-faint); margin-top:10px;}
  .stat-pills{display:flex; flex-wrap:wrap; gap:10px; margin-top:26px;}
  .pill{border:1px solid rgba(255,255,255,.35); background:rgba(255,255,255,.08); backdrop-filter:blur(6px); border-radius:100px; padding:9px 16px; font-size:13.5px; font-weight:600; color:var(--white);}
  .pill.on-light{border-color:var(--line); background:transparent; color:var(--ink);}
  .pill b{font-weight:800;}

  /* PAGE HERO (secondary pages) */
  .page-hero{position:relative; padding-top:0 !important; padding-bottom:0 !important; height:50vh; min-height:320px; max-height:480px; overflow:hidden;}
  .page-hero img{position:absolute; inset:0; width:100%; height:100%; object-fit:cover;}
  .page-hero::after{content:""; position:absolute; inset:0; background:linear-gradient(0deg, rgba(10,10,8,.68) 0%, rgba(10,10,8,.2) 55%, rgba(10,10,8,.05) 75%);}
  .page-hero-content{position:absolute; inset:0; z-index:2; display:flex; flex-direction:column; justify-content:flex-end; padding:0 var(--pad) clamp(28px,4vw,44px);}
  .page-hero-content .inner{max-width:var(--max); margin:0 auto; width:100%;}
  .page-hero h1{color:var(--white); font-size:clamp(32px,4.6vw,58px); max-width:18ch;}
  .page-hero .lede{color:rgba(255,255,255,.86); margin-top:12px; max-width:52ch;}
  .crumb{font-size:13px; color:rgba(255,255,255,.7); margin-bottom:14px;}
  .crumb a:hover{color:var(--white);}

  /* TRUST BAR */
  .trustbar{background:var(--cream); padding-top:22px; padding-bottom:22px;}
  .trustbar .wrap{display:flex; flex-wrap:wrap; align-items:center; justify-content:center; gap:14px 36px; text-align:center;}
  .trustbar .item{font-size:13.5px; font-weight:600; color:var(--ink); display:flex; align-items:center; gap:8px;}
  .trustbar .item svg{width:16px; height:16px; flex-shrink:0;}
  .trustbar img.badge{height:34px; width:auto;}

  /* AWARD BADGE */
  .award-strip{display:flex; align-items:center; gap:16px; background:var(--white); border:1px solid var(--line); border-radius:100px; padding:8px 20px 8px 8px; width:fit-content;}
  .award-strip img{height:40px; width:auto; border-radius:100px;}
  .award-strip span{font-size:13px; font-weight:600; color:var(--ink);}

  /* INTRO / PILLARS */
  .intro .wrap{text-align:center;}
  .intro h2{max-width:20ch; margin:0 auto 16px;}
  .intro .lede{max-width:60ch; margin:0 auto;}
  .pillars{display:flex; flex-wrap:wrap; justify-content:center; gap:10px; margin-top:36px;}
  .pillar-tag{border:1px solid var(--line); border-radius:100px; padding:10px 18px; font-size:13.5px; font-weight:600; color:var(--ink);}

  /* CARD GRID generic (villa / models) */
  .card-head{display:flex; justify-content:space-between; align-items:flex-end; gap:24px; margin-bottom:14px; flex-wrap:wrap;}
  .card-note{font-size:13px; color:var(--ink-faint); margin-bottom:32px; max-width:70ch;}
  .villa-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:18px;}
  .villa-card{border-radius:var(--radius-md); overflow:hidden; background:var(--cream); display:flex; flex-direction:column;}
  .villa-card-media{aspect-ratio:4/3; overflow:hidden; position:relative;}
  .villa-card-media img{position:absolute; inset:0; width:100%; height:100%; object-fit:cover; transition:opacity .4s ease, transform .5s ease;}
  .villa-card-media img.sec{opacity:0;}
  .villa-card:hover .villa-card-media img.sec{opacity:1;}
  .villa-card:hover .villa-card-media img.pri{transform:scale(1.04);}
  .villa-card-media.empty{display:flex; align-items:center; justify-content:center; background:var(--white); border:1.5px dashed var(--line);}
  .villa-card-media.empty span{font-size:13px; color:var(--ink-faint); font-style:italic; padding:0 20px; text-align:center;}
  .villa-badge{position:absolute; top:12px; left:12px; background:var(--white); border-radius:100px; padding:5px 12px; font-size:11.5px; font-weight:700; z-index:2;}
  .villa-card-body{padding:20px; display:flex; flex-direction:column; gap:10px; flex:1;}
  .villa-card-body h3{font-size:21px;}
  .villa-specs{display:flex; gap:14px; font-size:13.5px; color:var(--ink-soft); font-weight:500; flex-wrap:wrap;}
  .villa-price{font-size:14px; font-weight:600; color:var(--ink-faint); margin-top:auto;}
  .villa-price.real{color:var(--ink); font-weight:700;}
  .villa-price .from{display:block; font-weight:500; color:var(--ink-faint); font-size:12px;}
  .villa-card-body .quick-links{display:flex; gap:14px; margin-top:2px; flex-wrap:wrap;}
  .villa-card-body .quick-links a{font-size:12.5px; font-weight:600; text-decoration:underline; text-underline-offset:2px;}
  @media (max-width:980px){ .villa-grid{grid-template-columns:repeat(2,1fr);} }
  @media (max-width:600px){ .villa-grid{grid-template-columns:1fr;} }

  /* COMPARISON TABLE */
  /* v10: below 760px this table scrolls sideways with no scrollbar visible on most
     browsers/OSes -- the price columns and the View link could go undiscovered
     entirely. A visible hint + edge fade replace the scrollbar as the cue. */
  .compare-hint{display:none; font-size:13px; font-weight:700; color:var(--ink-soft); margin:14px 0 -6px;}
  .compare-wrap{position:relative; overflow-x:auto; -webkit-overflow-scrolling:touch; margin-top:28px;}
  .compare-table{width:100%; border-collapse:collapse; min-width:760px;}
  .compare-table th, .compare-table td{text-align:left; padding:13px 14px; border-bottom:1px solid var(--line); font-size:13.5px;}
  .compare-table th{font-size:12px; text-transform:uppercase; letter-spacing:.03em; color:var(--ink-faint); font-weight:700;}
  .compare-table td.model-name{font-weight:700; color:var(--ink);}
  .compare-table tr:hover td{background:var(--cream);}
  .compare-table a{font-weight:600; white-space:nowrap;}
  .compare-table a.compare-view{text-decoration:underline; text-underline-offset:3px;}
  @media (max-width:800px){
    .compare-hint{display:block;}
    .compare-wrap{box-shadow:inset -24px 0 16px -16px rgba(14,14,12,.12);}
  }

  /* BUSINESS LINES GRID */
  .biz-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:18px; margin-top:32px;}
  .biz-card{border-radius:var(--radius-md); overflow:hidden; background:var(--cream); display:flex; flex-direction:column;}
  .biz-card-media{aspect-ratio:4/3; overflow:hidden;}
  .biz-card-media img{width:100%; height:100%; object-fit:cover;}
  .biz-card-body{padding:22px; display:flex; flex-direction:column; gap:10px; flex:1;}
  .biz-card-body h3{font-size:19px;}
  .biz-card-body .tagline{font-size:13.5px; color:var(--ink-faint); margin-top:-4px;}
  .biz-tags{display:flex; flex-wrap:wrap; gap:6px; margin-top:4px;}
  .biz-tags span{font-size:11px; font-weight:600; color:var(--ink); border:1px solid var(--cream-line); border-radius:100px; padding:4px 10px;}
  .biz-price{font-size:13.5px; font-weight:700; color:var(--ink); margin-top:auto; padding-top:8px;}
  @media (max-width:980px){ .biz-grid{grid-template-columns:1fr 1fr;} }
  @media (max-width:640px){ .biz-grid{grid-template-columns:1fr;} }


  /* PROCESS */
  .process-head{max-width:50ch; margin-bottom:44px;}
  .process-list{display:flex; flex-direction:column;}
  .process-row{display:grid; grid-template-columns:56px 1fr 1.4fr; gap:28px; padding:26px 0; border-top:1px solid var(--line); align-items:start;}
  .process-list .process-row:last-child{border-bottom:1px solid var(--line);}
  .process-num{font-size:14px; font-weight:700; color:var(--ink-faint); padding-top:4px;}
  .process-row h3{margin-bottom:2px;}
  .process-row p{font-size:15px; max-width:52ch;}
  @media (max-width:760px){ .process-row{grid-template-columns:36px 1fr;} .process-row p{grid-column:1/-1; margin-top:4px;} }
  .callout{margin-top:36px; display:grid; grid-template-columns:1fr 1fr; border-radius:var(--radius-lg); overflow:hidden; background:var(--ink);}
  .callout-media{aspect-ratio:4/3; min-height:220px;}
  .callout-media img{width:100%; height:100%; object-fit:cover;}
  .callout-text{padding:clamp(24px,3.6vw,44px); display:flex; flex-direction:column; justify-content:center;}
  .callout-text span.tag{color:#c9c6b8; font-size:13.5px; font-weight:600; margin-bottom:10px; display:block;}
  .callout-text h3{color:var(--white); font-size:clamp(20px,2.2vw,26px); margin-bottom:12px; max-width:20ch;}
  .callout-text p{color:#d6d4c9; font-size:15px;}
  @media (max-width:760px){ .callout{grid-template-columns:1fr;} }

  /* EFFICIENCY (big stat) */
  .efficiency{background:var(--ink);}
  .efficiency .wrap{display:grid; grid-template-columns:1fr 1fr; gap:48px; align-items:center;}
  .efficiency .big-num{font-family:'Clash Display',sans-serif; font-size:clamp(64px,8vw,130px); font-weight:500; color:var(--white); letter-spacing:-0.02em; line-height:.9;}
  .efficiency .big-num sup{font-size:.35em; font-weight:700; margin-left:4px;}
  .efficiency h3{color:var(--white); margin-top:10px; font-size:clamp(18px,2vw,22px); max-width:22ch;}
  .efficiency p{color:#c9c6b8; margin-top:12px; font-size:15px;}
  .efficiency-media{border-radius:var(--radius-lg); overflow:hidden; aspect-ratio:4/3;}
  .efficiency-media img{width:100%; height:100%; object-fit:cover;}
  @media (max-width:860px){ .efficiency .wrap{grid-template-columns:1fr;} .efficiency-media{order:-1;} }

  /* FACTS grid */
  .facts{background:var(--cream);}
  .facts-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:34px 28px; margin-top:36px;}
  .fact{border-top:1px solid var(--cream-line); padding-top:18px;}
  .fact .num{font-family:'Clash Display',sans-serif; font-size:clamp(36px,4vw,48px); font-weight:500; color:var(--ink); letter-spacing:-0.02em; display:block; margin-bottom:8px;}
  .fact .label{font-size:14px; color:var(--ink-soft); max-width:32ch;}
  @media (max-width:760px){ .facts-grid{grid-template-columns:1fr 1fr;} }
  @media (max-width:480px){ .facts-grid{grid-template-columns:1fr;} }

  /* MISSION / FIGHTING FOR */
  .mission-list{display:flex; flex-direction:column; margin-top:36px;}
  .mission-item{display:grid; grid-template-columns:50px 1fr; gap:24px; padding:28px 0; border-top:1px solid var(--line);}
  .mission-list .mission-item:last-child{border-bottom:1px solid var(--line);}
  .mission-item .mnum{font-size:13px; font-weight:700; color:var(--ink-faint);}
  .mission-item h3{margin-bottom:8px;}
  .mission-item p{font-size:14.5px; max-width:64ch;}
  .mission-stats{display:flex; gap:28px; flex-wrap:wrap; margin-top:14px;}
  .mission-stats div{font-size:13px; color:var(--ink);}
  .mission-stats b{display:block; font-family:'Clash Display',sans-serif; font-size:20px; font-weight:500; color:var(--ink);}
  @media (max-width:700px){ .mission-item{grid-template-columns:1fr;} }

  /* BENEFITS (icon grid) */
  .benefits-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:44px; margin-top:36px;}
  .benefit-icon{width:44px; height:44px; border-radius:12px; background:var(--cream); display:flex; align-items:center; justify-content:center; margin-bottom:20px;}
  .benefit-icon svg{width:20px; height:20px; stroke:var(--ink);}
  .benefit h3{margin-bottom:8px; font-size:17px;}
  .benefit p{font-size:14.5px;}
  @media (max-width:860px){ .benefits-grid{grid-template-columns:1fr; gap:32px;} }

  /* BENEFIT CATEGORY TABS (Technology page) */
  .benefit-cats{display:grid; grid-template-columns:repeat(2,1fr); gap:36px; margin-top:16px;}
  .benefit-cat h3{font-size:15px; text-transform:uppercase; letter-spacing:.04em; color:var(--ink-faint); margin-bottom:18px;}
  .benefit-cat .bitem{padding:16px 0; border-top:1px solid var(--line);}
  .benefit-cat .bitem:last-child{border-bottom:1px solid var(--line);}
  .benefit-cat .bitem h4{font-size:15.5px; font-weight:700; color:var(--ink); margin-bottom:5px; font-family:'Inter';}
  .benefit-cat .bitem p{font-size:13.5px; margin:0;}
  @media (max-width:820px){ .benefit-cats{grid-template-columns:1fr;} }

  /* STEP EXPLAINED (technology system) */
  .step-explained{display:flex; flex-direction:column; margin-top:36px;}
  .step-ex-row{display:grid; grid-template-columns:0.9fr 1.1fr; gap:40px; align-items:center; padding:32px 0; border-top:1px solid var(--line);}
  .step-explained .step-ex-row:last-child{border-bottom:1px solid var(--line);}
  .step-ex-row.reverse{direction:rtl;}
  .step-ex-row.reverse > *{direction:ltr;}
  .step-ex-media{border-radius:var(--radius-md); overflow:hidden; aspect-ratio:4/3;}
  .step-ex-media img{width:100%; height:100%; object-fit:cover;}
  .step-ex-text .step-ex-num{font-size:13px; font-weight:700; color:var(--ink-faint); margin-bottom:8px;}
  .step-ex-text ul{margin-top:10px;}
  .step-ex-text li{font-size:14px; color:var(--ink-soft); padding-left:16px; position:relative; margin-bottom:6px;}
  .step-ex-text li::before{content:"–"; position:absolute; left:0; color:var(--ink-faint);}
  @media (max-width:820px){ .step-ex-row, .step-ex-row.reverse{grid-template-columns:1fr;} }

  /* SPEC TABLE */
  .spec-table{width:100%; border-collapse:collapse; margin-top:28px;}
  .spec-table tr{border-top:1px solid var(--line);}
  .spec-table tr:last-child{border-bottom:1px solid var(--line);}
  .spec-table td{padding:14px 8px; font-size:13.5px; vertical-align:top;}
  .spec-table td:first-child{color:var(--ink-faint); width:36%; font-weight:600;}
  .spec-table td:last-child{color:var(--ink); font-weight:500;}

  /* TEAM */
  .team-grid{display:grid; grid-template-columns:repeat(4,1fr); gap:18px; margin-top:36px;}
  .team-card{background:var(--cream); border-radius:var(--radius-md); padding:24px; text-align:center;}
  .team-avatar{width:56px; height:56px; border-radius:100px; background:var(--ink); color:var(--white); display:flex; align-items:center; justify-content:center; font-family:'Clash Display',sans-serif; font-size:18px; font-weight:500; margin:0 auto 16px;}
  .team-card h3{font-size:15.5px; margin-bottom:4px;}
  .team-card .role{font-size:12.5px; color:var(--ink-faint);}
  @media (max-width:860px){ .team-grid{grid-template-columns:1fr 1fr;} }

  /* LOCATIONS */
  .loc-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:20px; margin-top:32px;}
  .loc-card{border:1px solid var(--line); border-radius:var(--radius-md); padding:22px;}
  .loc-card .loctag{font-size:12px; font-weight:700; color:var(--ink-faint); text-transform:uppercase; letter-spacing:.03em; margin-bottom:8px;}
  .loc-card h3{font-size:16.5px; margin-bottom:8px;}
  .loc-card p{font-size:13.5px; margin-bottom:3px;}
  @media (max-width:900px){ .loc-grid{grid-template-columns:1fr;} }

  /* CERTS */
  .certs .wrap{text-align:center;}
  .certs h2{margin:0 auto 12px;}
  .certs .lede{margin:0 auto 32px;}
  .certs-logos{display:flex; align-items:center; justify-content:center; gap:32px; flex-wrap:wrap;}
  .certs-logos img{height:48px; width:auto; filter:grayscale(100%); opacity:.85;}
  .certs-list{display:flex; flex-wrap:wrap; justify-content:center; gap:10px; margin-top:28px;}
  .certs-list span{font-size:13px; font-weight:600; border:1px solid var(--line); border-radius:100px; padding:8px 16px;}

  /* DOWNLOAD CARDS */
  .download-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:16px; margin-top:32px;}
  .download-card{background:var(--cream); border-radius:var(--radius-md); padding:24px; display:flex; flex-direction:column; gap:14px;}
  .download-card .dl-icon{width:38px; height:38px; border-radius:10px; background:var(--white); display:flex; align-items:center; justify-content:center;}
  .download-card .dl-icon svg{width:18px; height:18px; stroke:var(--ink);}
  .download-card h3{font-size:16.5px;}
  .download-card p{font-size:13.5px; margin:0;}
  .download-card .btn{margin-top:auto; align-self:flex-start;}
  .download-card.disabled{opacity:.55;}
  .download-card.disabled .btn{background:var(--line); color:var(--ink-faint); pointer-events:none;}
  @media (max-width:860px){ .download-grid{grid-template-columns:1fr 1fr;} }
  @media (max-width:560px){ .download-grid{grid-template-columns:1fr;} }

  /* ORDERING STEPS */
  .step-list-v{display:flex; flex-direction:column; margin-top:36px;}
  .step-item-v{display:grid; grid-template-columns:56px 1fr; gap:24px; padding:24px 0; border-top:1px solid var(--line);}
  .step-list-v .step-item-v:last-child{border-bottom:1px solid var(--line);}
  .step-item-v .step-num-v{font-size:14px; font-weight:700; color:var(--ink-faint);}
  .step-item-v h3{margin-bottom:6px;}
  .step-item-v p{font-size:15px;}

  /* REVIEWS / STORIES placeholder */
  .stories-grid{display:grid; grid-template-columns:repeat(4,1fr); gap:14px; margin-top:32px;}
  .story-slot{border:1.5px dashed var(--line); border-radius:var(--radius-md); aspect-ratio:4/5; display:flex; align-items:center; justify-content:center; padding:20px; text-align:center;}
  .story-slot span{font-size:12.5px; color:var(--ink-faint); font-style:italic;}
  @media (max-width:860px){ .stories-grid{grid-template-columns:repeat(2,1fr);} }

  /* CONFIGURE */
  .configure{background:var(--cream);}
  .config-steps{display:grid; grid-template-columns:repeat(3,1fr); gap:20px; margin-top:20px;}
  .config-card{background:var(--white); border-radius:var(--radius-md); padding:22px;}
  .config-card .step-num{font-size:12.5px; font-weight:700; color:var(--ink-faint); margin-bottom:10px;}
  .config-card h3{font-size:17px; margin-bottom:14px;}
  .swatch-row{display:flex; gap:8px; flex-wrap:wrap;}
  .swatch{width:38px; height:38px; border-radius:9px; border:1px solid var(--cream-line); flex-shrink:0;}
  .swatch-label{font-size:11px; color:var(--ink-faint); margin-top:4px;}
  @media (max-width:860px){ .config-steps{grid-template-columns:1fr;} }

  /* BROCHURE */
  .brochure-grid{display:grid; grid-template-columns:1fr 1fr; gap:56px; align-items:center;}
  .brochure-form{display:flex; flex-direction:column; gap:10px;}
  .brochure-form input, .brochure-form select{padding:14px 16px; border-radius:var(--radius-sm); border:1px solid var(--cream-line); background:var(--white); font-family:inherit; font-size:14.5px; color:var(--ink);}
  .brochure-form input:focus-visible, .brochure-form select:focus-visible{outline:2px solid var(--ink); outline-offset:1px;}
  @media (max-width:860px){ .brochure-grid{grid-template-columns:1fr;} }

  /* FAQ */
  .faq-cat{font-size:13px; font-weight:700; color:var(--ink-faint); text-transform:uppercase; letter-spacing:.04em; margin:32px 0 12px;}
  .faq-cat:first-of-type{margin-top:0;}
  .accordion{max-width:900px; margin:0 auto; background:var(--cream); border-radius:var(--radius-md); overflow:hidden;}
  .acc-item{border-top:1px solid var(--cream-line);}
  .acc-item:first-child{border-top:none;}
  .acc-trigger{width:100%; background:none; border:none; text-align:left; display:flex; align-items:center; justify-content:space-between; gap:20px; padding:20px 26px; font-size:16px; font-weight:700; color:var(--ink);}
  .acc-trigger .icon{width:20px; height:20px; flex-shrink:0; position:relative;}
  .acc-trigger .icon::before, .acc-trigger .icon::after{content:""; position:absolute; background:var(--ink); top:50%; left:50%; transform:translate(-50%,-50%);}
  .acc-trigger .icon::before{width:13px; height:1.6px;}
  .acc-trigger .icon::after{width:1.6px; height:13px; transition:transform .2s ease;}
  .acc-item.open .acc-trigger .icon::after{transform:translate(-50%,-50%) rotate(90deg) scaleY(0);}
  .acc-panel{max-height:0; overflow:hidden; transition:max-height .25s ease;}
  .acc-item.open .acc-panel{max-height:500px;}
  .acc-panel-inner{padding:0 26px 24px; font-size:15px; color:var(--ink-soft);}

  /* CTA */
  .cta{background:var(--ink);}
  .cta .wrap{text-align:center;}
  .cta h2{color:var(--white); margin:0 auto 16px; max-width:16ch;}
  .cta p{color:#d6d4c9; margin:0 auto 32px; max-width:52ch; font-size:16px;}
  .cta-actions{display:flex; gap:14px; justify-content:center; flex-wrap:wrap;}
  .cta .btn-outline{color:var(--white); border-color:#55534a;}
  .cta .btn-outline:hover{background:var(--white); color:var(--ink);}

  /* NEWSLETTER */
  .newsletter{background:var(--cream); border-radius:var(--radius-lg); padding:clamp(28px,4vw,48px); display:flex; justify-content:space-between; align-items:center; gap:24px; flex-wrap:wrap; margin-bottom:var(--section-pad-sm);}
  .newsletter-form{display:flex; gap:10px; flex-wrap:wrap;}
  .newsletter-form input{padding:13px 16px; border-radius:var(--radius-sm); border:1px solid var(--cream-line); font-family:inherit; font-size:14px; min-width:220px;}

  /* FOOTER */
  footer{padding-top:var(--section-pad); padding-bottom:40px;}
  .footer-top{display:grid; grid-template-columns:1.3fr repeat(4,1fr); gap:28px; padding-bottom:44px; border-bottom:1px solid var(--line);}
  .footer-brand img{height:24px; margin-bottom:18px;}
  .footer-brand p{font-size:13px; color:var(--ink-faint); line-height:1.7; max-width:30ch;}
  .footer-col h4{font-size:12.5px; font-weight:700; color:var(--ink); margin-bottom:14px; text-transform:uppercase; letter-spacing:.03em;}
  .footer-col li{margin-bottom:10px; font-size:14px; color:var(--ink-soft);}
  .footer-col a:hover{color:var(--ink);}
  .footer-social{display:flex; gap:12px; margin-top:18px;}
  .footer-social a{width:32px; height:32px; border-radius:100px; border:1px solid var(--line); display:flex; align-items:center; justify-content:center;}
  .footer-social svg{width:13px; height:13px;}
  .footer-langs{display:flex; gap:14px; margin-top:18px; font-size:12.5px; color:var(--ink-faint);}
  .footer-langs a:hover{color:var(--ink);}
  .footer-langs .cur{color:var(--ink); font-weight:700;}
  .footer-addresses{display:flex; gap:40px; flex-wrap:wrap; padding:28px 0; border-bottom:1px solid var(--line); margin-top:8px;}
  .footer-addresses div{font-size:12.5px; color:var(--ink-faint); max-width:260px;}
  .footer-addresses b{display:block; color:var(--ink); font-size:12.5px; font-weight:700; margin-bottom:4px;}
  .footer-bottom{display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:14px; padding-top:24px;}
  .footer-bottom p{font-size:12.5px; color:var(--ink-faint);}
  .footer-legal{display:flex; gap:18px; flex-wrap:wrap;}
  .footer-legal a{font-size:12.5px; color:var(--ink-faint);}
  .footer-certs{display:flex; gap:14px; align-items:center;}
  .footer-certs img{height:30px; width:auto; opacity:.75;}
  @media (max-width:1000px){ .footer-top{grid-template-columns:1fr 1fr 1fr;} .newsletter{flex-direction:column; align-items:flex-start;} }
  @media (max-width:640px){ .footer-top{grid-template-columns:1fr 1fr;} }

  /* STICKY CONVERSION BAR */
  .sticky-cta{position:fixed; left:0; right:0; bottom:0; z-index:70; background:var(--ink); color:var(--white); padding:14px var(--pad); display:flex; align-items:center; justify-content:space-between; gap:16px; flex-wrap:wrap; transform:translateY(120%); transition:transform .3s ease; box-shadow:0 -8px 24px rgba(0,0,0,.12);}
  .sticky-cta.show{transform:translateY(0);}
  .sticky-cta p{margin:0; font-size:14px; font-weight:600; color:var(--white); max-width:none;}
  .sticky-cta .sc-actions{display:flex; align-items:center; gap:10px;}
  .sticky-cta .sc-close{background:none; border:none; color:#c9c6b8; font-size:20px; line-height:1; padding:4px 6px;}
  @media (max-width:600px){ .sticky-cta p{display:none;} }

  /* LEGAL PAGES */
  .legal-body{max-width:820px; margin:0 auto;}
  .legal-body h2{font-size:28px; margin-bottom:6px;}
  .legal-updated{font-size:13px; color:var(--ink-faint); margin-bottom:36px;}
  .legal-body h3{font-size:18px; margin-top:34px; margin-bottom:12px;}
  .legal-body p{max-width:none; font-size:15px; margin-bottom:14px;}
  .legal-body li{max-width:none; font-size:15px; margin-bottom:8px; padding-left:18px; position:relative;}
  .legal-body li::before{content:"–"; position:absolute; left:0; color:var(--ink-faint);}
  .legal-notice{background:var(--cream); border-radius:var(--radius-md); padding:20px 24px; margin-bottom:36px; font-size:13.5px; color:var(--ink-soft);}

  /* SIGNATURE BUILDS */
  .signature-item{display:grid; grid-template-columns:1fr 1fr; gap:44px; align-items:center;}
  .signature-item + .signature-item{margin-top:48px;}
  .signature-item.reverse .sig-media{order:2;}
  .sig-media{border-radius:var(--radius-lg); overflow:hidden; aspect-ratio:4/3;}
  .sig-media img{width:100%; height:100%; object-fit:cover;}
  .sig-text .kicker{font-size:13.5px; font-weight:600; color:var(--ink-faint); margin-bottom:10px; display:block;}
  .sig-text p{margin-top:14px;}
  .sig-facts{display:flex; gap:20px; margin-top:20px; flex-wrap:wrap;}
  .sig-facts div{font-size:13.5px; font-weight:600; color:var(--ink);}
  .sig-facts span{display:block; font-weight:400; color:var(--ink-faint); font-size:12.5px;}
  @media (max-width:800px){ .signature-item, .signature-item.reverse{grid-template-columns:1fr;} .signature-item.reverse .sig-media{order:0;} }

  /* FEATURE SPLIT (sustainability/comfort) */
  .feature-split .wrap{display:grid; grid-template-columns:1fr 1fr; gap:48px; align-items:center;}
  .feature-split .ft-media{border-radius:var(--radius-lg); overflow:hidden; aspect-ratio:4/3;}
  .feature-split .ft-media img{width:100%; height:100%; object-fit:cover;}
  .feature-split .ft-num{font-family:'Clash Display',sans-serif; font-size:clamp(40px,4.6vw,60px); font-weight:500; color:var(--ink); letter-spacing:-0.02em; margin-bottom:6px; display:block;}
  .feature-split p{margin-top:14px;}
  .feature-split.reverse .ft-media{order:2;}
  @media (max-width:860px){ .feature-split .wrap{grid-template-columns:1fr;} .feature-split.reverse .ft-media{order:0;} }

  /* MATERIALS mini block */
  .materials{background:var(--cream);}
  .materials-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:32px; margin-top:36px;}
  .materials-grid .num{font-family:'Clash Display',sans-serif; font-size:clamp(32px,3.6vw,44px); font-weight:500; color:var(--ink); display:block; margin-bottom:8px;}
  .materials-grid .label{font-size:14px;}
  @media (max-width:700px){ .materials-grid{grid-template-columns:1fr;} }

  /* REVIEWS shell */
  .reviews-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:16px; margin-top:32px;}
  .review-slot{border:1.5px dashed var(--line); border-radius:var(--radius-md); padding:26px; min-height:150px; display:flex; flex-direction:column; justify-content:center;}
  .review-slot span{font-size:13px; color:var(--ink-faint); font-style:italic;}
  @media (max-width:760px){ .reviews-grid{grid-template-columns:1fr;} }

  /* PEACE OF MIND */
  .peace-grid{display:grid; grid-template-columns:repeat(5,1fr); gap:22px; margin-top:36px;}
  .peace-item svg{width:26px; height:26px; margin-bottom:14px; stroke:var(--ink);}
  .peace-item h3{font-size:16px; margin-bottom:6px;}
  .peace-item p{font-size:13.5px;}
  @media (max-width:980px){ .peace-grid{grid-template-columns:repeat(3,1fr);} }
  @media (max-width:640px){ .peace-grid{grid-template-columns:repeat(2,1fr);} }

  /* MODEL DETAIL (Solutions page) */
  .model-detail{border-top:1px solid var(--line); padding-top:var(--section-pad-sm); padding-bottom:var(--section-pad-sm);}
  .model-detail:first-of-type{border-top:none;}
  .model-head{display:flex; justify-content:space-between; align-items:flex-end; gap:20px; flex-wrap:wrap; margin-bottom:24px;}
  .model-specs-row{display:flex; gap:24px; flex-wrap:wrap; margin-top:10px;}
  .model-specs-row div{font-size:14px; font-weight:600; color:var(--ink);}
  .model-specs-row span{display:block; font-size:12px; font-weight:400; color:var(--ink-faint);}
  .model-photos{display:grid; grid-template-columns:1.4fr 1fr; gap:14px;}
  .model-photos-single{aspect-ratio:4/3; overflow:hidden; border-radius:var(--radius-md);}
  .model-photos-single img{width:100%; height:100%; object-fit:cover; display:block;}
  @media (max-width:760px){ .model-photos{grid-template-columns:1fr;} }
  .config-mini{margin-top:24px; display:flex; gap:10px; flex-wrap:wrap;}
  .config-mini span{font-size:12.5px; font-weight:600; color:var(--ink); border:1px solid var(--line); border-radius:100px; padding:7px 14px;}

  /* BUSINESS SPLIT (For Businesses, compact secondary section) */
  .biz-split{background:var(--ink); border-radius:var(--radius-lg); padding:clamp(28px,4vw,52px); display:grid; grid-template-columns:1.2fr 1fr; gap:40px; align-items:center;}
  .biz-split h2{color:var(--white);}
  .biz-split p{color:#d6d4c9;}
  .biz-stats{display:grid; grid-template-columns:1fr 1fr; gap:20px;}
  .biz-stats div{border-top:1px solid #3a3934; padding-top:14px;}
  .biz-stats .num{font-family:'Clash Display',sans-serif; font-size:clamp(26px,3vw,34px); font-weight:500; color:var(--white); display:block;}
  .biz-stats .lbl{font-size:12.5px; color:#c9c6b8;}
  @media (max-width:860px){ .biz-split{grid-template-columns:1fr;} }

  /* IMAGE PLACEHOLDER (generic, reusable) */
  .img-placeholder{border:1.5px dashed var(--line); border-radius:var(--radius-md); background:var(--cream); display:flex; flex-direction:column; align-items:center; justify-content:center; gap:8px; color:var(--ink-faint); text-align:center; padding:20px;}
  .img-placeholder svg{width:26px; height:26px; stroke:var(--ink-faint); opacity:.6;}
  .img-placeholder span{font-size:12px; font-style:italic;}

  /* USP / BENEFITS (homepage centerpiece) */
  .usp-grid{display:grid; grid-template-columns:repeat(2,1fr); gap:20px; margin-top:36px;}
  .usp-card{background:var(--cream); border-radius:var(--radius-lg); overflow:hidden; display:flex; flex-direction:column;}
  .usp-card .usp-media{aspect-ratio:16/10;}
  .usp-card .usp-media img{width:100%; height:100%; object-fit:cover; display:block;}
  .usp-card .usp-media.img-placeholder{aspect-ratio:16/10; border-radius:0;}
  .usp-card-body{padding:26px;}
  .usp-card-body h3{font-size:19px; margin-bottom:8px;}
  .usp-card-body p{font-size:14.5px; margin:0;}
  @media (max-width:820px){ .usp-grid{grid-template-columns:1fr;} }

  /* ABOUT: STORY ALTERNATING BLOCKS (image-forward) */
  .story-block{display:grid; grid-template-columns:1fr 1fr; gap:48px; align-items:center;}
  .story-block + .story-block{margin-top:72px;}
  .story-block.reverse .story-media{order:2;}
  .story-media{border-radius:var(--radius-lg); overflow:hidden; aspect-ratio:4/3;}
  .story-media img{width:100%; height:100%; object-fit:cover; display:block;}
  .story-media.img-placeholder{aspect-ratio:4/3;}
  .story-text .eyebrow{margin-bottom:10px;}
  .story-text p{margin-top:14px; font-size:15.5px;}
  @media (max-width:820px){ .story-block, .story-block.reverse{grid-template-columns:1fr;} .story-block.reverse .story-media{order:0;} }

  /* ABOUT: STAT BAND OVER PHOTO */
  .stat-band{position:relative; border-radius:var(--radius-lg); overflow:hidden;}
  .stat-band img{width:100%; height:100%; object-fit:cover; display:block; min-height:320px;}
  .stat-band::after{content:""; position:absolute; inset:0; background:linear-gradient(0deg, rgba(10,10,8,.78) 0%, rgba(10,10,8,.15) 60%);}
  .stat-band-content{position:absolute; inset:0; z-index:2; display:flex; align-items:flex-end; padding:clamp(24px,4vw,44px);}
  .stat-band-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:28px; width:100%;}
  .stat-band-grid .num{font-family:'Clash Display',sans-serif; font-size:clamp(28px,3.4vw,42px); font-weight:500; color:var(--white); display:block;}
  .stat-band-grid .lbl{font-size:12.5px; color:rgba(255,255,255,.78); margin-top:4px;}
  @media (max-width:700px){ .stat-band-grid{grid-template-columns:1fr; gap:16px;} }

  /* ABOUT: TEAM (photo-forward cards) */
  .team-grid-v2{display:grid; grid-template-columns:repeat(4,1fr); gap:18px; margin-top:36px;}
  .team-card-v2{border-radius:var(--radius-md); overflow:hidden; background:var(--cream);}
  .team-card-v2 .tphoto{aspect-ratio:3/4;}
  .team-card-v2 .tphoto img{width:100%; height:100%; object-fit:cover; display:block;}
  .team-card-v2 .tphoto.img-placeholder{aspect-ratio:3/4; border-radius:0;}
  .team-card-v2 .tbody{padding:16px 18px 20px;}
  .team-card-v2 h3{font-size:15.5px; margin-bottom:3px;}
  .team-card-v2 .role{font-size:12.5px; color:var(--ink-faint);}
  @media (max-width:860px){ .team-grid-v2{grid-template-columns:1fr 1fr;} }

  /* ABOUT: MISSION (tightened) */
  .mission-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:32px; margin-top:36px;}
  .mission-card{border-top:1px solid var(--line); padding-top:20px;}
  .mission-card h3{font-size:17px; margin-bottom:10px;}
  .mission-card p{font-size:14px;}
  @media (max-width:820px){ .mission-grid{grid-template-columns:1fr;} }


/* =====================================================================
   v3 additions
   ===================================================================== */

/* ---- photo slots: any missing photo turns into a marked placeholder ---- */
.media{position:relative; overflow:hidden; border-radius:var(--radius-md); background:#ebe7de;}
.media.r-43{aspect-ratio:4/3;}
.media.r-169{aspect-ratio:16/9;}
.media.r-32{aspect-ratio:3/2;}
.media > img, .media > .img-placeholder{position:absolute; inset:0; width:100%; height:100%;}
.media > img{object-fit:cover; display:block;}
.media.contain{background:#fff; border:1px solid var(--line);}
.media.contain > img{object-fit:contain; padding:14px;}
.media > .img-placeholder{border-radius:0; border:1.5px dashed #c9c4b6; background:var(--cream);}
.img-placeholder{min-height:120px;}
.fine{font-size:12.5px; color:var(--ink-faint); max-width:78ch; margin-top:14px;}

/* ---- header: real mobile menu + email CTA ---- */
.nav{border-bottom:1px solid transparent;}
.nav-right{gap:14px;}
.nav-toggle{display:none; width:42px; height:42px; border-radius:10px; border:1.5px solid var(--line); background:#fff; align-items:center; justify-content:center; flex-direction:column; gap:5px; padding:0;}
.nav-toggle span{display:block; width:18px; height:1.8px; background:var(--ink); transition:transform .2s, opacity .2s;}
.nav.open .nav-toggle span:nth-child(1){transform:translateY(6.8px) rotate(45deg);}
.nav.open .nav-toggle span:nth-child(2){opacity:0;}
.nav.open .nav-toggle span:nth-child(3){transform:translateY(-6.8px) rotate(-45deg);}
.nav-links a[aria-current="page"], .nav-item > a[aria-current="page"]{box-shadow:inset 0 -2px 0 var(--ink);}
@media (max-width:900px){
  .nav-toggle{display:flex;}
  .nav .wrap{position:relative;}
  .nav.open .nav-links{display:flex; flex-direction:column; align-items:stretch; gap:0; position:absolute; top:100%; left:0; right:0; background:#fff; padding:8px var(--pad) 22px; border-bottom:1px solid var(--line); box-shadow:0 18px 30px rgba(14,14,12,.08);}
  .nav.open .nav-links > a, .nav.open .nav-item > a, .nav.open .nav-item > span{padding:14px 0; border-bottom:1px solid var(--line); font-size:16px;}
  .nav.open .nav-dropdown{position:static; opacity:1; visibility:visible; transform:none; box-shadow:none; border:none; margin:0; padding:2px 0 8px 14px; min-width:0;}
  .nav.open .nav-dropdown a{padding:10px 0; font-size:15px;}
  .nav-right .btn{padding:12px 16px; font-size:14px;}
}
@media (max-width:420px){ .nav-right .btn{display:none;} }

/* ---- hero: tighter, with a quiet second line ---- */
.hero-note{color:rgba(255,255,255,.72); font-size:13.5px; margin-top:12px; max-width:52ch;}

/* ---- collections ---- */
.coll-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:20px; margin-top:38px;}
.coll-card{display:flex; flex-direction:column; background:var(--cream); border-radius:var(--radius-lg); overflow:hidden; transition:transform .2s ease;}
.coll-card:hover{transform:translateY(-3px);}
.coll-card .media{border-radius:0; aspect-ratio:4/3;}
.coll-body{padding:26px 26px 28px; display:flex; flex-direction:column; gap:10px; flex:1;}
.coll-body h3{font-size:24px;}
.coll-body p{font-size:15px; color:var(--ink-soft);}
.coll-link{margin-top:auto; padding-top:8px; font-weight:700; font-size:14.5px; color:var(--ink); text-decoration:underline; text-underline-offset:3px;}
@media (max-width:980px){ .coll-grid{grid-template-columns:1fr;} .coll-card{flex-direction:row;} .coll-card .media{width:42%; aspect-ratio:auto; min-height:220px;} }
@media (max-width:620px){ .coll-card{flex-direction:column;} .coll-card .media{width:100%; aspect-ratio:4/3; min-height:0;} }

/* ---- four phases (home) ---- */
.phases{display:grid; grid-template-columns:repeat(4,1fr); gap:28px; margin-top:52px;}
.phase{position:relative; padding-top:28px; border-top:2px solid var(--ink);}
.phase .ph-n{position:absolute; top:-16px; left:0; width:30px; height:30px; border-radius:50%; background:var(--ink); color:#fff; font-weight:700; font-size:13px; display:flex; align-items:center; justify-content:center;}
.phase h3{font-size:19px; margin-bottom:8px;}
.phase p{font-size:14.5px;}
.phase .permit{margin-top:10px; font-size:13.5px; color:var(--ink); font-weight:600;}
@media (max-width:900px){ .phases{grid-template-columns:1fr 1fr; gap:44px 24px;} }
@media (max-width:560px){ .phases{grid-template-columns:1fr;} }

/* ---- documents teaser (home) ---- */
.docs-teaser{display:grid; grid-template-columns:repeat(4,1fr); gap:16px; margin-top:34px;}
.doc-card{background:#fff; border-radius:var(--radius-md); padding:22px; display:flex; flex-direction:column; gap:10px; border:1px solid var(--line);}
.doc-card h4{font-family:'Clash Display','Inter',sans-serif; font-weight:500; font-size:18px; color:var(--ink); line-height:1.15;}
.doc-card p{font-size:14px; color:var(--ink-soft); margin:0;}
.doc-card .doc-note{font-size:12.5px; color:var(--ink-faint);}
.doc-card .btn{margin-top:auto; align-self:flex-start;}
.doc-card.is-pending{background:transparent; border-style:dashed;}
.doc-n{width:28px; height:28px; border-radius:50%; border:1.5px solid var(--ink); font-size:12.5px; font-weight:700; color:var(--ink); display:flex; align-items:center; justify-content:center;}
.btn.is-off{background:transparent; border:1.5px dashed #c9c4b6; color:var(--ink-faint); cursor:default; pointer-events:none;}
.doc-when{font-size:12.5px; font-weight:700; color:var(--ink-faint);}
@media (max-width:980px){ .docs-teaser{grid-template-columns:1fr 1fr;} }
@media (max-width:560px){ .docs-teaser{grid-template-columns:1fr;} }
.btn-row{display:flex; gap:12px; flex-wrap:wrap; margin-top:30px;}

/* ---- model cards ---- */
.mdl{padding:60px 0; border-top:1px solid var(--line);}
.mdl:first-child{border-top:none; padding-top:12px;}
.mdl-top{display:grid; grid-template-columns:1.2fr 1fr; gap:44px; align-items:start;}
.mdl-hero{border-radius:var(--radius-lg);}
.mdl-coll{font-size:13.5px; color:var(--ink-faint); font-weight:600; margin-bottom:6px;}
.mdl-info h3{font-size:clamp(30px,3.4vw,44px); margin-bottom:10px;}
.mdl-tag{font-size:16.5px; color:var(--ink); max-width:38ch; line-height:1.4;}
.specs{display:grid; grid-template-columns:repeat(3,1fr); gap:16px 20px; margin:26px 0 22px; padding:20px 0; border-top:1px solid var(--line); border-bottom:1px solid var(--line);}
.specs dt{font-size:12px; color:var(--ink-faint); font-weight:600; margin-bottom:2px;}
.specs dd{font-size:16.5px; font-weight:700; color:var(--ink);}
.mdl-price{display:flex; align-items:baseline; gap:10px; margin-bottom:14px;}
.mdl-price span{font-size:13.5px; color:var(--ink-faint); font-weight:600;}
.mdl-price b{font-family:'Clash Display','Inter',sans-serif; font-weight:500; font-size:28px; color:var(--ink);}
.mdl-desc{font-size:15px; max-width:52ch; margin-bottom:20px;}
.mdl-actions{display:flex; gap:10px; flex-wrap:wrap;}
.mdl-links{display:flex; gap:22px; flex-wrap:wrap; margin-top:16px; font-size:14px; max-width:none;}
.mdl-links a{font-weight:600; color:var(--ink); text-decoration:underline; text-underline-offset:3px;}
.mdl-gallery{display:grid; gap:14px; margin-top:16px;}
.mdl-gallery.g-2{grid-template-columns:repeat(2,1fr);}
.mdl-gallery.g-3{grid-template-columns:repeat(3,1fr);}
@media (max-width:900px){ .mdl-top{grid-template-columns:1fr; gap:26px;} }
@media (max-width:640px){ .mdl-gallery.g-2, .mdl-gallery.g-3{grid-template-columns:1fr;} .specs{grid-template-columns:1fr 1fr;} }

/* ---- two ways to start ---- */
.exec-grid{display:grid; grid-template-columns:1fr 1fr; gap:20px; margin-top:34px;}
.exec{background:#fff; border-radius:var(--radius-lg); overflow:hidden; border:1px solid var(--line);}
.exec .media{border-radius:0; aspect-ratio:16/9;}
.exec-body{padding:26px 28px 30px;}
.exec-body h3{font-size:23px; margin-bottom:6px;}
.exec-body > p{font-size:14.5px; color:var(--ink-soft); margin-bottom:16px;}
.exec-body ul li{font-size:14px; color:var(--ink-soft); padding:7px 0 7px 18px; position:relative; border-top:1px solid var(--line);}
.exec-body ul li::before{content:""; position:absolute; left:0; top:15px; width:8px; height:1.5px; background:var(--ink-faint);}
@media (max-width:860px){ .exec-grid{grid-template-columns:1fr;} }

/* ---- page banner without a photo still looks intentional ---- */
.page-hero{background:#1c1b18;}
.page-hero.slim{height:auto; min-height:0; max-height:none; padding-top:0 !important;}

/* ---- how it works ---- */
.how-hero{background:var(--cream); padding-top:clamp(40px,5vw,72px); padding-bottom:clamp(28px,3vw,44px);}
.how-hero h1{font-size:clamp(38px,5.2vw,68px); max-width:16ch;}
.how-hero .lede{max-width:60ch; margin-top:18px;}
.note-strip{margin-top:22px; font-size:14px; color:var(--ink-soft); max-width:68ch; padding-left:16px; border-left:2.5px solid var(--ink);}
.journey{margin-top:10px;}
.j-step{display:grid; grid-template-columns:56px 1fr; gap:26px; position:relative; padding-bottom:34px;}
.j-step::before{content:""; position:absolute; left:27px; top:58px; bottom:2px; width:1.5px; background:#cfc9ba;}
.j-step:last-child::before{display:none;}
.j-num{width:56px; height:56px; border-radius:50%; background:var(--ink); color:#fff; font-family:'Clash Display','Inter',sans-serif; font-weight:500; font-size:22px; display:flex; align-items:center; justify-content:center; position:relative; z-index:1;}
.j-card{background:#fff; border-radius:var(--radius-md); padding:26px 28px 28px; border:1px solid var(--line);}
.j-card h3{font-size:22px; margin-bottom:6px;}
.j-who{font-size:12.5px; font-weight:700; color:var(--ink-faint); margin-bottom:10px;}
.j-card p{font-size:15.5px; max-width:64ch; margin-bottom:10px;}
.j-card p:last-of-type{margin-bottom:0;}
.j-docs{display:flex; gap:8px; flex-wrap:wrap; margin-top:16px;}
.j-doc{font-size:13px; font-weight:600; color:var(--ink); border:1.5px solid var(--ink); border-radius:100px; padding:7px 15px; display:inline-flex; gap:8px; align-items:center; background:#fff;}
.j-doc svg{width:13px; height:13px; stroke:currentColor;}
.j-doc:hover{background:var(--ink); color:#fff;}
.j-key{background:var(--ink); border-color:var(--ink);}
.j-key h3, .j-key p{color:#fff;}
.j-key .j-who{color:#b9b6a8;}
.j-key p{color:#d6d4c9;}
.j-key .permit-list{margin:12px 0 4px;}
.j-key .permit-list li{color:#e6e4da; font-size:15px; padding:6px 0 6px 20px; position:relative; border-top:1px solid #34332e;}
.j-key .permit-list li::before{content:""; position:absolute; left:0; top:15px; width:9px; height:1.5px; background:#8f8c7f;}
.j-key .permit-list li b{color:#fff; font-weight:700;}
@media (max-width:640px){ .j-step{grid-template-columns:40px 1fr; gap:16px;} .j-num{width:40px; height:40px; font-size:16px;} .j-step::before{left:19px; top:44px;} .j-card{padding:20px;} }

.roles{display:grid; grid-template-columns:repeat(3,1fr); background:#fff; border:1px solid var(--line); border-radius:var(--radius-md); overflow:hidden; margin-top:30px;}
.role{padding:26px 28px 30px; border-right:1px solid var(--line);}
.role:last-child{border-right:none;}
.role h3{font-size:20px; margin-bottom:12px;}
.role li{font-size:14.5px; color:var(--ink-soft); padding:8px 0 8px 18px; position:relative; border-top:1px solid var(--line);}
.role li::before{content:""; position:absolute; left:0; top:17px; width:8px; height:1.5px; background:var(--ink-faint);}
@media (max-width:860px){ .roles{grid-template-columns:1fr;} .role{border-right:none; border-bottom:1px solid var(--line);} .role:last-child{border-bottom:none;} }

.timing{display:grid; grid-template-columns:repeat(3,1fr); gap:30px; margin-top:30px;}
.timing div{border-top:1px solid var(--line); padding-top:16px;}
.timing .num{font-family:'Clash Display','Inter',sans-serif; font-weight:500; font-size:clamp(30px,3.4vw,44px); color:var(--ink); display:block; margin-bottom:6px;}
.timing .lbl{font-size:14px; color:var(--ink-soft);}
@media (max-width:700px){ .timing{grid-template-columns:1fr;} }

/* ---- download center ---- */
.dc-wrap{padding-top:clamp(20px,3vw,40px);}
.tabs{display:flex; gap:8px; flex-wrap:wrap;}
.tab, .chip{font-family:inherit; cursor:pointer; border:1.5px solid var(--line); background:#fff; color:var(--ink); border-radius:100px; font-weight:700;}
.tab{padding:12px 22px; font-size:15px;}
.chip{padding:8px 16px; font-size:13.5px; border-color:transparent; background:var(--cream);}
.tab.on{background:var(--ink); color:#fff; border-color:var(--ink);}
.chip.on{background:#fff; border-color:var(--ink);}
.tab:hover:not(.on), .chip:hover:not(.on){border-color:var(--ink);}
.chips{display:flex; gap:8px; flex-wrap:wrap; margin-top:14px;}
.dc-panel{margin-top:26px; background:var(--cream); border-radius:var(--radius-lg); padding:clamp(22px,3.4vw,44px);}
.dc-head{display:flex; align-items:baseline; gap:16px; flex-wrap:wrap; margin-bottom:6px;}
.dc-head h3{font-size:clamp(28px,3.2vw,40px);}
.dc-head p{font-size:15px; color:var(--ink-faint); font-weight:600;}
.dc-stage{margin-top:30px;}
.dc-stage h4{font-size:15px; font-weight:700; color:var(--ink);}
.dc-stage > p{font-size:14px; color:var(--ink-soft); max-width:70ch; margin:4px 0 16px;}
.doc-grid{display:grid; grid-template-columns:repeat(2,1fr); gap:14px;}
@media (max-width:700px){ .doc-grid{grid-template-columns:1fr;} }
.dc-general{margin-top:40px;}
.dc-general h4{font-size:15px; font-weight:700; color:var(--ink); margin-bottom:12px;}
.gen-doc{display:flex; gap:16px; align-items:center; background:#fff; border:1px solid var(--line); border-radius:var(--radius-md); padding:18px 22px; margin-bottom:10px; transition:border-color .15s;}
.gen-doc:hover{border-color:var(--ink);}
.gen-ic{width:42px; height:42px; border-radius:12px; background:var(--ink); display:flex; align-items:center; justify-content:center; flex-shrink:0;}
.gen-ic svg{width:18px; height:18px; stroke:#fff;}
.gen-doc b{display:block; color:var(--ink); font-size:16px;}
.gen-doc em{font-style:normal; font-size:14px; color:var(--ink-soft);}

/* ---- certification badges ---- */
.cert-row{display:flex; align-items:center; justify-content:center; gap:14px; flex-wrap:wrap; margin-top:26px;}
.cert-row span{font-size:13.5px; font-weight:700; color:var(--ink); border:1.5px solid var(--ink); border-radius:8px; padding:9px 16px;}
.cert-row img{height:46px; width:auto; filter:grayscale(1); opacity:.9; margin-left:8px;}
.footer-certs span{font-size:11.5px; font-weight:700; color:var(--ink-faint);}

/* ---- compare table header wraps ---- */
.compare-table th{vertical-align:bottom; line-height:1.3;}

/* ---- newsletter row now a mail link ---- */
.newsletter .btn{white-space:nowrap;}

@media (prefers-reduced-motion: reduce){
  *{transition:none !important; scroll-behavior:auto !important; animation:none !important;}
}

/* ---- fixes from review ---- */
/* icons drawn with stroke-only SVGs were invisible without an explicit stroke */
:where(svg[fill="none"]:not([stroke])){stroke:currentColor;}

/* placeholders that sit flush inside rounded cards: no clipped dashed edge */
.coll-card .media, .exec .media, .tphoto .media, .callout-media .media{background:#e9e5da;}
.coll-card .media > .img-placeholder, .exec .media > .img-placeholder, .tphoto .media > .img-placeholder, .callout-media .media > .img-placeholder{border:none; background:#e9e5da;}

/* USP cards: white cards with the photo inset, so placeholders read as boxes */
.usp-card{background:#fff; padding:12px;}
.usp-card .media{border-radius:16px;}
.usp-card-body{padding:22px 16px 14px;}

/* logo, certificates, footer */
.nav-logo img{height:32px;}
.cert-row img, .footer-certs img{filter:none; opacity:1;}
.footer-addresses{display:grid; grid-template-columns:repeat(4,1fr); gap:24px 28px;}
.footer-addresses div{max-width:none;}
@media (max-width:980px){ .footer-addresses{grid-template-columns:1fr 1fr;} }
@media (max-width:560px){ .footer-addresses{grid-template-columns:1fr;} }

/* comparison table: let the two price headings wrap */
.compare-table th.pk{width:19%; white-space:normal;}
.specs .wide{grid-column:1 / -1;}
.nav-only-mobile{display:none;}
@media (max-width:900px){ .nav.open .nav-links > a.nav-only-mobile{display:block; margin-top:14px; padding:15px 0; text-align:center; background:var(--ink); color:#fff; border-radius:8px; border-bottom:none; font-weight:700;} }

/* =====================================================================
   v4 additions: calculators, model cards, business hub, About
   ===================================================================== */
:focus-visible{outline:2px solid var(--ink); outline-offset:2px;}

/* ---- home: villa model cards ---- */
.mc-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:20px; margin-top:38px;}
.mc{display:flex; flex-direction:column; background:var(--cream); border-radius:var(--radius-lg); overflow:hidden; transition:transform .2s ease;}
.mc:hover{transform:translateY(-3px);}
.mc .media{border-radius:0; background:#e9e5da;}
.mc .media > .img-placeholder{border:none; background:#e9e5da;}
.mc-body{padding:22px 24px 26px;}
.mc-body h3{font-size:24px; margin-bottom:4px;}
.mc-spec{font-size:14.5px; color:var(--ink-soft);}
.mc-price{font-size:15px; font-weight:700; color:var(--ink); margin-top:10px;}
.mc-more{justify-content:center; align-items:flex-start; padding:34px; background:var(--ink); gap:8px;}
.mc-more span{font-size:14px; color:#b9b6a8;}
.mc-more b{font-family:'Clash Display','Inter',sans-serif; font-weight:500; font-size:27px; line-height:1.15; color:#fff;}
@media (max-width:980px){ .mc-grid{grid-template-columns:1fr 1fr;} }
@media (max-width:560px){ .mc-grid{grid-template-columns:1fr;} }

/* ---- calculators ---- */
.calc{display:grid; grid-template-columns:1fr 1.15fr; background:#fff; border:1px solid var(--line); border-radius:var(--radius-lg); overflow:hidden; margin-top:34px;}
.calc-in{padding:clamp(22px,3vw,38px); border-right:1px solid var(--line);}
.calc-in h3{font-size:20px; margin-bottom:16px;}
.calc-out{padding:clamp(22px,3vw,38px); background:var(--cream);}
.fld{margin-top:22px;}
.fld label{display:flex; justify-content:space-between; gap:14px; font-size:14px; font-weight:600; color:var(--ink); margin-bottom:9px;}
.fld output{font-weight:700; white-space:nowrap;}
.fld input[type=range]{width:100%; accent-color:var(--ink); height:26px; margin:0; cursor:pointer;}
.fld select{width:100%; padding:13px 14px; border-radius:10px; border:1.5px solid var(--line); font:inherit; font-weight:600; background:#fff; color:var(--ink);}
.money{display:flex; align-items:center; border:1.5px solid var(--line); border-radius:10px; padding:0 14px; background:#fff;}
.money span{color:var(--ink-faint); font-weight:700;}
.money input{border:none; outline:none; padding:13px 10px; font:inherit; font-weight:700; width:100%; background:transparent; color:var(--ink);}
.money:focus-within{border-color:var(--ink);}
.calc-k{font-size:14px; color:var(--ink-soft); font-weight:600;}
.calc-big{font-family:'Clash Display','Inter',sans-serif; font-weight:500; font-size:clamp(42px,5.4vw,68px); line-height:1; color:var(--ink); margin:8px 0 22px;}
.calc-big small{font-family:'Inter',sans-serif; font-size:16px; color:var(--ink-faint); font-weight:600;}
.calc-stats{display:grid; grid-template-columns:repeat(2,1fr); gap:18px 24px; padding:18px 0; border-top:1px solid #d8d2c4;}
.calc-stats.four{grid-template-columns:repeat(4,1fr);}
.calc-stats dt{font-size:12.5px; color:var(--ink-faint); font-weight:600; margin-bottom:2px;}
.calc-stats dd{font-size:17px; font-weight:700; color:var(--ink);}
.bars{margin-bottom:6px;}
.bar{display:grid; grid-template-columns:100px 1fr 86px; align-items:center; gap:12px; font-size:13.5px; margin-bottom:10px; color:var(--ink-soft);}
.bar i{display:block; height:14px; background:#e2ddcf; border-radius:100px; overflow:hidden;}
.bar b{display:block; height:100%; background:#9a968a; border-radius:100px; transition:width .3s ease;}
.bar.we b{background:var(--ink);}
.bar em{font-style:normal; font-weight:700; color:var(--ink); text-align:right;}
.chart svg{width:100%; height:auto; display:block; margin:6px 0 20px;}
.chart .zero{stroke:#b9b4a6; stroke-width:1; stroke-dasharray:4 4;}
.chart .line{fill:none; stroke:var(--ink); stroke-width:2.5; stroke-linejoin:round;}
.chart .area{fill:rgba(14,14,12,.06);}
.chart text{font-family:'Inter',sans-serif; font-size:11.5px; fill:var(--ink-faint);}
.chart .lbl{fill:var(--ink); font-weight:700;}
.chart .be{fill:var(--ink); font-weight:700; font-size:12px;}
.chart .dot{fill:#fff; stroke:var(--ink); stroke-width:2.5;}
.calc-out .btn{margin-top:2px;}
@media (max-width:900px){ .calc{grid-template-columns:1fr;} .calc-in{border-right:none; border-bottom:1px solid var(--line);} .calc-stats.four{grid-template-columns:1fr 1fr;} }
@media (max-width:480px){ .bar{grid-template-columns:82px 1fr 72px;} }

/* ---- business ---- */
.pillars{display:grid; grid-template-columns:repeat(3,1fr); gap:34px; margin-top:34px;}
.pillar{border-top:1.5px solid var(--ink); padding-top:18px;}
.pillar h3{font-size:20px; margin-bottom:8px;}
.pillar p{font-size:15px;}
@media (max-width:800px){ .pillars{grid-template-columns:1fr; gap:26px;} }
.steps3{display:grid; grid-template-columns:repeat(3,1fr); gap:28px; margin-top:34px;}
.steps3 .phase{padding-top:28px;}
@media (max-width:800px){ .steps3{grid-template-columns:1fr; gap:40px;} }
.coll-grid.two{grid-template-columns:1fr 1fr;}
@media (max-width:980px){ .coll-grid.two{grid-template-columns:1fr;} }

/* ---- About ---- */
.backers{display:grid; grid-template-columns:repeat(3,1fr); gap:16px; margin-top:32px;}
.backer{background:var(--cream); border-radius:var(--radius-md); padding:26px 26px 28px;}
.backer h3{font-size:20px; margin-bottom:8px;}
.backer p{font-size:15px; color:var(--ink-soft);}
@media (max-width:800px){ .backers{grid-template-columns:1fr;} }
.tl{margin-top:26px; max-width:860px;}
.tl-row{display:grid; grid-template-columns:120px 1fr; gap:26px; padding:22px 0; border-top:1px solid var(--line);}
.tl-row:last-child{border-bottom:1px solid var(--line);}
.tl-year{font-family:'Clash Display','Inter',sans-serif; font-weight:500; font-size:30px; color:var(--ink); line-height:1.1;}
.tl-row p{font-size:16px; max-width:60ch;}
@media (max-width:560px){ .tl-row{grid-template-columns:1fr; gap:6px;} }
.facts{display:grid; grid-template-columns:1fr 1fr; gap:0 44px; margin-top:26px; max-width:980px;}
.facts li{padding:15px 0 15px 22px; border-top:1px solid var(--line); position:relative; font-size:15.5px; color:var(--ink-soft);}
.facts li::before{content:""; position:absolute; left:0; top:25px; width:9px; height:1.5px; background:var(--ink);}
.facts li b{color:var(--ink);}
@media (max-width:760px){ .facts{grid-template-columns:1fr;} }
.cert-row img{height:74px; margin-left:14px;}
.footer-certs img{height:42px;}
@media (max-width:640px){
  .chart text{font-size:19px;}
  .chart .be{font-size:20px;}
}

/* =====================================================================
   Configurator
   ===================================================================== */
.cfg-top{padding-top:clamp(28px,4vw,52px);}
.cfg-top h1{font-size:clamp(34px,4.6vw,56px);}
.cfg-top .lede{max-width:58ch; margin-top:12px;}
.cfg-top .chips{margin-top:22px;}
.cfg-steps{list-style:none; display:flex; gap:6px; margin:32px 0 6px; padding:0;}
.cfg-steps li{flex:1; min-width:0;}
.cfg-steps .st{width:100%; display:flex; align-items:center; gap:10px; padding:13px 6px 0; background:none; border:none; border-top:2px solid var(--line); cursor:pointer; font:inherit; text-align:left; color:var(--ink-faint);}
.cfg-steps .n{width:26px; height:26px; border-radius:50%; border:1.5px solid #b9b4a6; display:flex; align-items:center; justify-content:center; font-size:12.5px; font-weight:700; flex-shrink:0;}
.cfg-steps .t{font-size:13.5px; font-weight:700;}
.cfg-steps .st.on{border-top-color:var(--ink); color:var(--ink);}
.cfg-steps .st.on .n{background:var(--ink); color:#fff; border-color:var(--ink);}
.cfg-steps .st.done{border-top-color:var(--ink); color:var(--ink);}
.cfg-steps .st.done .n{border-color:var(--ink); color:var(--ink);}
.cfg-steps .st.dim{opacity:.55;}
.cfg-prog{display:none;}
.cfg{display:grid; grid-template-columns:minmax(0,1fr) 390px; gap:38px; align-items:start; margin-top:20px; padding-bottom:80px;}
.cfg-main{padding-top:16px; min-width:0;}
.cfg-h{font-family:'Clash Display','Inter',sans-serif; font-weight:500; font-size:clamp(26px,3vw,36px); line-height:1.1; color:var(--ink); margin-bottom:8px;}
.cfg-lede{font-size:16px; color:var(--ink-soft); max-width:60ch; margin-bottom:22px;}
.cfg-sub{font-size:15px; font-weight:700; color:var(--ink); margin:32px 0 12px;}
.cfg-lede + .opt-grid, .cfg-lede + .pkg-grid{margin-top:0;}

.opt-grid{display:grid; gap:14px; margin-top:6px;}
.opt-grid.g1{grid-template-columns:1fr;} .opt-grid.g2{grid-template-columns:repeat(2,1fr);} .opt-grid.g3{grid-template-columns:repeat(3,1fr);}
@media (max-width:1180px) and (min-width:981px){ .opt-grid.g3{grid-template-columns:repeat(2,1fr);} }
@media (max-width:700px){ .opt-grid.g2, .opt-grid.g3{grid-template-columns:1fr;} }
.opt{position:relative; display:flex; flex-direction:column; background:#fff; border:1.5px solid var(--line); border-radius:var(--radius-md); overflow:hidden; cursor:pointer; transition:border-color .15s, box-shadow .15s;}
.opt:hover{border-color:#b9b4a6;}
.opt input{position:absolute; opacity:0; pointer-events:none;}
.opt:focus-within{outline:2px solid var(--ink); outline-offset:2px;}
.opt.on{border-color:var(--ink); box-shadow:0 0 0 1px var(--ink);}
.opt .media{display:block; border-radius:0;}
.opt-body{display:flex; flex-direction:column; gap:3px; padding:14px 50px 16px 16px;}
.opt-name{font-weight:700; color:var(--ink); font-size:15px; line-height:1.25;}
.opt-sub{font-size:13.5px; color:var(--ink-soft);}
.opt-note{font-size:13px; color:var(--ink-faint); line-height:1.4;}
.opt-price{font-weight:700; color:var(--ink); font-size:14.5px; margin-top:4px;}
.opt-mark{position:absolute; top:12px; right:12px; width:22px; height:22px; border-radius:50%; border:1.5px solid #b9b4a6; background:#fff; box-shadow:0 1px 4px rgba(14,14,12,.12);}
.opt.on .opt-mark{background:var(--ink); border-color:var(--ink);}
.opt.on .opt-mark::after{content:""; position:absolute; left:6.5px; top:3px; width:5px; height:9px; border:solid #fff; border-width:0 2px 2px 0; transform:rotate(45deg);}
.opt.text{min-height:92px; justify-content:center;}
.opt.locked{opacity:.5; pointer-events:none;}
.opt.row{flex-direction:row; align-items:center; gap:14px; padding:16px 54px 16px 16px; margin-top:14px;}
.opt.row .opt-body{padding:0; flex:1;}
.opt.row .opt-price{margin:0;}
.opt-grid.rows .opt{flex-direction:row; align-items:center;}
.opt-grid.rows .opt-body{flex:1; flex-direction:row; flex-wrap:wrap; align-items:baseline; gap:2px 16px;}
.opt-grid.rows .opt-price{margin:0 0 0 auto;}
.opt-grid.rows .opt-note{flex-basis:100%; order:3;}
.opt-grid.rows .opt-mark{top:50%; margin-top:-11px;}
.opt-grid.rows .opt-body{padding-right:56px;}

.pkg-grid{display:grid; grid-template-columns:repeat(2,1fr); gap:16px;}
@media (max-width:820px){ .pkg-grid{grid-template-columns:1fr;} }
.pkg .opt-body{padding:20px 22px 24px; gap:6px;}
.pkg .opt-name{font-family:'Clash Display','Inter',sans-serif; font-weight:500; font-size:22px;}
.pkg-price{font-family:'Clash Display','Inter',sans-serif; font-weight:500; font-size:30px; color:var(--ink); margin:2px 0 4px;}
.pkg-list{margin:12px 0 0; padding:0; list-style:none;}
.pkg-list li{font-size:13.5px; color:var(--ink-soft); padding:5px 0 5px 16px; position:relative; border-top:1px solid var(--line);}
.pkg-list li::before{content:""; position:absolute; left:0; top:13px; width:7px; height:1.5px; background:var(--ink-faint);}
.pkg-ex{font-size:12.5px; color:var(--ink-faint); margin-top:12px; padding-top:12px; border-top:1px dashed #cfc9ba; line-height:1.45;}

.plans{display:grid; gap:14px; margin-bottom:20px;}
.plans.p1{grid-template-columns:1fr; max-width:620px;}
.plans.p2{grid-template-columns:1fr 1fr;}
.plans .media{aspect-ratio:16/10;}
@media (max-width:700px){ .plans.p2{grid-template-columns:1fr;} }

.lock-note{display:flex; gap:18px; align-items:center; justify-content:space-between; flex-wrap:wrap; background:var(--cream); border-radius:var(--radius-md); padding:18px 22px; margin-bottom:8px;}
.lock-note p{font-size:14.5px; max-width:54ch; margin:0;}

.pills{display:flex; flex-wrap:wrap; gap:8px;}
.pill{position:relative; display:inline-flex; padding:10px 16px; border:1.5px solid var(--line); border-radius:100px; font-size:14px; font-weight:600; color:var(--ink); background:#fff; cursor:pointer;}
.pill input{position:absolute; opacity:0; pointer-events:none;}
.pill.on{background:var(--ink); color:#fff; border-color:var(--ink);}
.pill:focus-within{outline:2px solid var(--ink); outline-offset:2px;}
.ff-grid{display:grid; grid-template-columns:1fr 1fr; gap:22px;}
.ff.wide{grid-column:1 / -1;}
.ff label{display:block; font-size:14px; font-weight:600; color:var(--ink); margin-bottom:8px;}
.ff label i{font-style:normal; font-weight:500; color:var(--ink-faint); font-size:12px; margin-left:6px;}
.ff input[type=text], .ff input[type=email], .ff input[type=tel], .ff textarea{width:100%; padding:13px 14px; border:1.5px solid var(--line); border-radius:10px; font:inherit; background:#fff; color:var(--ink);}
.ff input:focus, .ff textarea:focus{border-color:var(--ink); outline:none;}
.ff.bad input, .ff.bad textarea{border-color:#b3261e;}
.ff-err{display:block; font-size:12.5px; color:#b3261e; margin-top:6px;}
@media (max-width:640px){ .ff-grid{grid-template-columns:1fr;} }
.cfg-main .fine{margin-top:16px;}

.cfg-nav{display:flex; justify-content:space-between; align-items:center; gap:16px; margin-top:38px; padding-top:22px; border-top:1px solid var(--line);}
.cfg-nav .tot{display:none;}
.cfg-nav .btns{display:flex; gap:10px; margin-left:auto;}

.cfg-side{position:sticky; top:92px; background:#fff; border:1px solid var(--line); border-radius:var(--radius-lg); overflow:hidden auto; max-height:calc(100vh - 112px);}
.side-img{border-radius:0;}
.side-body{padding:22px 24px 26px;}
.side-body h2{font-size:26px;}
.side-sub{font-size:14px; color:var(--ink-faint); margin:2px 0 14px;}
.cfg-lines{list-style:none; margin:0; padding:0; border-top:1px solid var(--line);}
.cfg-lines li{display:grid; grid-template-columns:1fr auto; gap:0 14px; padding:11px 0; border-bottom:1px solid var(--line);}
.cfg-lines .k{grid-column:1 / -1; font-size:11.5px; font-weight:700; color:var(--ink-faint);}
.cfg-lines .v{font-size:14px; color:var(--ink); font-weight:600; line-height:1.3;}
.cfg-lines .p{font-size:14px; font-weight:700; color:var(--ink); white-space:nowrap; text-align:right;}
.cfg-lines .p.soft{font-weight:500; color:var(--ink-faint); white-space:normal; font-size:12.5px; max-width:110px;}
.cfg-total{display:flex; justify-content:space-between; align-items:baseline; margin-top:18px;}
.cfg-total span{font-weight:700; color:var(--ink);}
.cfg-total b{font-family:'Clash Display','Inter',sans-serif; font-weight:500; font-size:32px; color:var(--ink);}
.side-help{margin-top:8px;}
.cfg-close{display:none;}

.cfg-done{padding-top:10px;}
.next3{display:grid; grid-template-columns:repeat(3,1fr); gap:14px; margin:26px 0;}
.next3 div{background:var(--cream); border-radius:var(--radius-md); padding:20px;}
.next3 b{display:block; color:var(--ink); margin-bottom:6px; font-size:15px;}
.next3 span{font-size:14px; color:var(--ink-soft);}
@media (max-width:760px){ .next3{grid-template-columns:1fr;} }

@media (max-width:980px){
  .cfg-steps{display:none;}
  .cfg-prog{display:block; margin:24px 0 2px; font-size:13.5px; font-weight:700; color:var(--ink);}
  .cfg-prog i{display:block; height:4px; background:var(--line); border-radius:4px; margin-top:8px; overflow:hidden;}
  .cfg-prog b{display:block; height:100%; background:var(--ink);}
  .cfg{grid-template-columns:1fr; padding-bottom:120px;}
  .cfg-nav{position:fixed; left:0; right:0; bottom:0; z-index:60; background:#fff; margin:0; padding:12px var(--pad); border-top:1px solid var(--line); box-shadow:0 -10px 24px rgba(14,14,12,.07);}
  .cfg-nav .tot{display:flex; flex-direction:column; align-items:flex-start; background:none; border:none; padding:0; text-align:left; cursor:pointer; font:inherit;}
  .cfg-nav .tot small{font-size:11.5px; color:var(--ink-faint); font-weight:600;}
  .cfg-nav .tot b{font-family:'Clash Display','Inter',sans-serif; font-weight:500; font-size:20px; color:var(--ink); line-height:1.1;}
  .cfg-nav .tot em{font-style:normal; font-size:12px; text-decoration:underline; color:var(--ink);}
  .cfg-side{position:fixed; inset:0; z-index:80; border-radius:0; max-height:none; overflow-y:auto; transform:translateY(100%); visibility:hidden; transition:transform .25s ease, visibility .25s; border:none;}
  .cfg-side.open{transform:none; visibility:visible;}
  .cfg-close{display:block; position:absolute; top:12px; right:12px; z-index:2; background:#fff; border:1.5px solid var(--line); border-radius:100px; padding:8px 16px; font:inherit; font-weight:700; cursor:pointer;}
}

/* print sheet: "Save a copy as PDF" */
#printSheet{display:none;}
@media print{
  body > *:not(#printSheet){display:none !important;}
  #printSheet{display:block !important; color:#000; font-family:'Inter',Arial,sans-serif; padding:0;}
  #printSheet .pl{height:34px; margin-bottom:22px;}
  #printSheet h1{font-size:26px; margin:0 0 4px; font-family:'Clash Display','Inter',sans-serif; font-weight:500;}
  #printSheet h2{font-size:16px; margin:26px 0 8px;}
  #printSheet .pd{font-size:12px; color:#555; margin-bottom:18px;}
  #printSheet .pt{width:100%; border-collapse:collapse; font-size:12.5px;}
  #printSheet .pt th{text-align:left; font-size:11px; color:#555; border-bottom:1.5px solid #000; padding:6px 6px;}
  #printSheet .pt td{padding:8px 6px; border-bottom:1px solid #ddd; vertical-align:top;}
  #printSheet .r{text-align:right; white-space:nowrap;}
  #printSheet .ptot{display:flex; justify-content:space-between; align-items:baseline; margin:14px 0 6px; font-size:14px; padding:0 6px;}
  #printSheet .ptot b{font-size:22px; font-family:'Clash Display','Inter',sans-serif; font-weight:500;}
  #printSheet .pn{font-size:11px; color:#555; margin-top:10px;}
  @page{margin:16mm;}
}
.side-img{display:block; aspect-ratio:16/9;}
.cfg-lines li{padding:9px 0;}
.pkg-more{margin-top:12px;}
.pkg-more summary{cursor:pointer; font-weight:700; font-size:13.5px; color:var(--ink); text-decoration:underline; text-underline-offset:3px; list-style:none;}
.pkg-more summary::-webkit-details-marker{display:none;}
.pkg-more[open] summary{margin-bottom:6px;}
.cfg-total{margin:0 0 6px; padding-bottom:16px; border-bottom:1px solid var(--line);}
.cfg-lines{border-top:none;}
.opt-grid.rows .opt, .opt-grid.rows .opt.text{min-height:0;}
.opt-grid.rows .opt-body{padding:16px 56px 16px 18px;}
.more{margin-top:26px; border:1.5px solid var(--line); border-radius:var(--radius-md); background:#fff;}
.more > summary{cursor:pointer; padding:18px 22px; font-weight:700; color:var(--ink); list-style:none; display:flex; align-items:center; gap:10px;}
.more > summary::-webkit-details-marker{display:none;}
.more > summary::after{content:"+"; margin-left:auto; font-size:22px; font-weight:500; line-height:1;}
.more[open] > summary::after{content:"\2212";}
.more > summary em{font-style:normal; font-weight:500; font-size:12.5px; color:var(--ink-faint);}
.more > .ff-grid{padding:4px 22px 24px;}
#printSheet .ptot{max-width:none;}

/* =====================================================================
   v8: icon system, motion, model frame, illustrated pages
   ===================================================================== */
:root{--accent:#EFA93B; --accent-soft:#FBE7BF;}
.ic{display:block; width:1em; height:1em; overflow:visible;}
.ic .acc{fill:var(--accent);}
.tile{width:88px; height:88px; border-radius:26px; background:#fff; color:var(--ink); display:flex; align-items:center; justify-content:center; box-shadow:0 12px 26px -14px rgba(14,14,12,.28);}
.tile .ic{font-size:52px;}
.tile.soft{background:var(--accent-soft); box-shadow:none;}
.tile.sm{width:60px; height:60px; border-radius:18px;} .tile.sm .ic{font-size:36px;}
.draw .ic *{stroke-dasharray:1; stroke-dashoffset:1;}
.draw.in .ic *{animation:icdraw 1.15s cubic-bezier(.6,.1,.2,1) forwards;}
@keyframes icdraw{to{stroke-dashoffset:0;}}
.reveal{opacity:0; transform:translateY(24px); transition:opacity .7s ease, transform .7s ease; transition-delay:var(--d,0s);}
.reveal.in{opacity:1; transform:none;}
@media (prefers-reduced-motion: reduce){ .reveal{opacity:1; transform:none;} .draw .ic *{stroke-dasharray:none; stroke-dashoffset:0; animation:none !important;} }
.cert-txt{display:inline-block; font-size:12.5px; font-weight:700; color:var(--ink); border:1.5px solid var(--ink); border-radius:8px; padding:8px 12px;}
.iso{height:64px; width:auto; display:block;}

/* ---- model block: one picture frame on the left, information on the right ---- */
.mdl{display:grid; grid-template-columns:minmax(0,1.12fr) minmax(0,1fr); gap:clamp(28px,4.4vw,64px); align-items:start; padding:60px 0; border-top:1px solid var(--line);}
.mdl:first-child{border-top:none; padding-top:8px;}
.mdl-gal{position:sticky; top:92px;}
.frame{position:relative; aspect-ratio:4/3; border-radius:var(--radius-lg); overflow:hidden; background:#ebe7de;}
.view{position:absolute; inset:0; opacity:0; pointer-events:none; transition:opacity .4s ease;}
.view.on{opacity:1; pointer-events:auto;}
.view > img, .view > .img-placeholder{position:absolute; inset:0; width:100%; height:100%;}
.view > img{object-fit:cover; display:block;}
.view > .img-placeholder{border-radius:0; border:1.5px dashed #c9c4b6; background:var(--cream);}
.v-plan{background:#fff;}
.plans-view{position:absolute; inset:0; display:grid; gap:10px; padding:20px 22px;}
.plans-view.p1{grid-template-rows:1fr;} .plans-view.p2{grid-template-rows:1fr 1fr;}
.plans-view figure{position:relative; margin:0; min-height:0; display:flex; flex-direction:column;}
.plans-view figure img{width:100%; height:100%; object-fit:contain; position:static;}
.plans-view figure .img-placeholder{position:static; flex:1; width:100%; height:100%; min-height:0; border:1.5px dashed #c9c4b6; background:var(--cream);}
.plans-view figcaption{position:static; order:-1; font-size:11.5px; font-weight:700; color:var(--ink-faint); padding:0 0 6px;}
.seg{display:flex; gap:6px; margin-top:14px; flex-wrap:wrap;}
.seg button{font:inherit; font-weight:700; font-size:14px; padding:10px 18px; border-radius:100px; border:1.5px solid var(--line); background:#fff; color:var(--ink); cursor:pointer;}
.seg button.on{background:var(--ink); color:#fff; border-color:var(--ink);}
.seg button:hover:not(.on){border-color:var(--ink);}
.mdl-info{padding-top:6px;}
@media (max-width:900px){ .mdl{grid-template-columns:1fr; gap:24px; padding:44px 0;} .mdl-gal{position:static;} }

/* ---- configurator: contrasting summary, wide package rows ---- */
.cfg-side{background:var(--ink); color:#fff; border:none;}
.cfg-side .side-body::before{content:"Your configuration"; display:inline-block; background:var(--accent); color:var(--ink); font-size:12px; font-weight:700; padding:5px 12px; border-radius:100px; margin-bottom:12px;}
.cfg-side .side-body h2{color:#fff;} .cfg-side .side-sub{color:#a9a698;}
.cfg-side .cfg-total{border-bottom-color:#34332e;} .cfg-side .cfg-total span{color:#d6d4c9;} .cfg-side .cfg-total b{color:var(--accent);}
.cfg-side .cfg-lines li{border-bottom-color:#34332e;} .cfg-side .cfg-lines .k{color:#8f8c7f;} .cfg-side .cfg-lines .v, .cfg-side .cfg-lines .p{color:#fff;} .cfg-side .cfg-lines .p.soft{color:#a9a698;}
.cfg-side .fine{color:#a9a698;} .cfg-side .fine a{color:#fff;}
.cfg-side .cfg-close{background:#fff; color:var(--ink);}
.cfg-hint{display:flex; flex-wrap:wrap; align-items:center; gap:8px 26px; margin:18px 0 0; font-size:14px; color:var(--ink-soft);}
.cfg-hint b{display:inline-flex; align-items:center; justify-content:center; width:24px; height:24px; border-radius:50%; background:var(--ink); color:#fff; font-size:12.5px; margin-right:10px;}
.cfg-hint b:nth-of-type(2){background:var(--accent); color:var(--ink);}
@media (max-width:980px){ .cfg-hint{display:none;} }
.pkg-grid{grid-template-columns:1fr; gap:16px;}
.opt.pkg{display:grid; grid-template-columns:minmax(220px,36%) minmax(0,1fr); align-items:stretch;}
.opt.pkg .pkg-media{aspect-ratio:auto; min-height:230px; height:100%; border-radius:0;}
.pkg-main{display:flex; flex-direction:column; gap:6px; padding:24px 64px 24px 26px;}
.pkg-main .opt-name{font-family:'Clash Display','Inter',sans-serif; font-weight:500; font-size:23px;}
.pkg-price{font-family:'Clash Display','Inter',sans-serif; font-weight:500; font-size:30px; color:var(--ink);}
.pkg-more{margin-top:12px;}
.pkg-incl{margin-top:12px;}
.pkg-incl ul{margin:0; padding:0; list-style:none; column-count:2; column-gap:30px;}
.pkg-incl li{break-inside:avoid; font-size:13.5px; color:var(--ink-soft); padding:6px 0 6px 16px; position:relative; border-top:1px solid var(--line);}
.pkg-incl li::before{content:""; position:absolute; left:0; top:14px; width:7px; height:1.5px; background:var(--ink-faint);}
.pkg-incl .pkg-ex{display:block; margin:14px 0 0; padding:12px 0 0; border-top:1px dashed #cfc9ba; font-size:12.5px; line-height:1.55; color:var(--ink-faint);}
@media (max-width:820px){ .opt.pkg{grid-template-columns:1fr;} .opt.pkg .pkg-media{aspect-ratio:16/9; min-height:0; height:auto;} .pkg-main{padding:20px 60px 22px 20px;} .pkg-incl ul{column-count:1;} }
.plan-note{margin-top:10px;}

/* ---- home: illustrated steps, race, business band ---- */
.steps-ic{display:grid; grid-template-columns:repeat(4,1fr); gap:18px; margin-top:44px;}
.sic{position:relative; background:#fff; border-radius:var(--radius-lg); padding:26px 24px 28px; transition:transform .25s ease, box-shadow .25s ease;}
.sic:hover{transform:translateY(-5px); box-shadow:0 26px 40px -26px rgba(14,14,12,.35);}
.sic .tile{margin-bottom:18px; background:var(--cream); box-shadow:none;}
.sic .n{position:absolute; top:20px; right:24px; font-family:'Clash Display','Inter',sans-serif; font-size:38px; color:#e2dccd; line-height:1;}
.sic h3{font-size:20px; margin-bottom:6px;}
.sic p{font-size:14.5px; color:var(--ink-soft); margin:0; max-width:26ch;}
.sic .flag{display:inline-block; margin-top:14px; background:var(--accent-soft); font-weight:700; font-size:12.5px; padding:6px 12px; border-radius:100px; color:var(--ink);}
@media (max-width:980px){ .steps-ic{grid-template-columns:1fr 1fr;} } @media (max-width:560px){ .steps-ic{grid-template-columns:1fr;} }
.race{margin-top:26px; background:var(--ink); color:#fff; border-radius:var(--radius-lg); padding:clamp(24px,4vw,44px);}
.race h3{color:#fff; font-size:clamp(24px,3vw,34px); margin-bottom:6px;}
.race > p{color:#b9b6a8; font-size:15px; max-width:52ch;}
.lane{display:grid; grid-template-columns:160px 1fr; align-items:center; gap:16px; margin-top:20px;}
.lane > span{font-size:14px; color:#c9c6b8; font-weight:600;}
.lane i{display:block; height:48px; border-radius:14px; background:#2a2925; position:relative; overflow:hidden;}
.lane i b{position:absolute; inset:0 auto 0 0; width:0; border-radius:14px; background:#6f6c60; transition:width 1.7s cubic-bezier(.2,.8,.2,1);}
.lane.we i b{background:var(--accent); transition-delay:.25s;}
.lane i em{position:absolute; left:16px; top:50%; transform:translateY(-50%); font-style:normal; font-weight:700; font-size:14px; color:#fff; z-index:2; white-space:nowrap;}
.lane.we i em{color:var(--ink);}
.race.in .lane.old i b{width:100%;} .race.in .lane.we i b{width:50%;}
@media (max-width:640px){ .lane{grid-template-columns:1fr; gap:8px;} .lane i em{font-size:12.5px;} }
@media (prefers-reduced-motion: reduce){ .lane i b{transition:none;} }
.biz-band{background:var(--ink); color:#fff; padding:clamp(64px,9vw,120px) 0; overflow:hidden;}
.biz-band h2{color:#fff; font-size:clamp(46px,8.6vw,124px); line-height:.94; max-width:11ch; letter-spacing:-.02em;}
.biz-band .lede{color:#c9c6b8; max-width:46ch; margin-top:22px;}
.biz-tiles{display:grid; grid-template-columns:repeat(5,1fr); gap:14px; margin-top:48px;}
.bt{position:relative; display:flex; flex-direction:column; gap:14px; min-height:230px; padding:24px 20px 24px; border-radius:var(--radius-lg); background:#1c1b18; border:1px solid #34332e; color:#fff; transition:transform .28s ease, background .28s ease, border-color .28s ease;}
.bt:hover{transform:translateY(-8px); background:#262521; border-color:var(--accent);}
.bt .ic{font-size:58px; color:#fff;} .bt .ic .acc{fill:var(--accent);}
.bt h3{color:#fff; font-size:19px; line-height:1.15;}
.bt .tag{margin-top:auto; font-size:12.5px; font-weight:700; color:var(--accent);}
.bt.live .tag{color:#fff; text-decoration:underline; text-underline-offset:3px;}
@media (max-width:1100px){ .biz-tiles{grid-template-columns:repeat(3,1fr);} } @media (max-width:640px){ .biz-tiles{grid-template-columns:1fr 1fr;} .bt{min-height:190px;} }
.save-band{display:grid; grid-template-columns:auto 1fr auto; gap:30px; align-items:center; background:var(--accent-soft); border-radius:var(--radius-lg); padding:clamp(24px,3.6vw,42px);}
.save-band h2{font-size:clamp(28px,3.4vw,42px); max-width:22ch;} .save-band p{margin-top:8px; max-width:52ch;}
.save-band .tile{background:#fff;}
@media (max-width:860px){ .save-band{grid-template-columns:1fr; gap:18px;} }

/* ---- how it works: illustrated journey ---- */
.hj{position:relative; display:grid; gap:34px; padding:14px 0 30px;}
.hj::before{content:""; position:absolute; left:50%; top:0; bottom:0; width:3px; margin-left:-1.5px; background:#e0dacb; border-radius:3px;}
.hj::after{content:""; position:absolute; left:50%; top:0; width:3px; margin-left:-1.5px; height:calc(var(--p,0) * 100%); background:var(--accent); border-radius:3px;}
.hj-mark{position:absolute; left:50%; top:calc(var(--p,0) * 100%); transform:translate(-50%,-50%); z-index:3; width:54px; height:54px; border-radius:50%; background:var(--accent); color:var(--ink); display:flex; align-items:center; justify-content:center; box-shadow:0 12px 26px -10px rgba(239,169,59,.85);}
.hj-mark .ic{font-size:30px;} .hj-mark .ic .acc{fill:#fff;}
.hj-step{position:relative; width:calc(50% - 60px);}
.hj-step.r{margin-left:auto;}
.hj-step::after{content:""; position:absolute; top:44px; width:16px; height:16px; border-radius:50%; background:#fff; border:3px solid var(--ink);}
.hj-step.l::after{right:-68px;} .hj-step.r::after{left:-68px;}
.hj-card{position:relative; background:#fff; border-radius:var(--radius-lg); padding:26px 28px 28px; display:grid; grid-template-columns:auto 1fr; gap:6px 22px; align-items:center; transition:transform .25s ease, box-shadow .25s ease;}
.hj-card:hover{transform:translateY(-4px); box-shadow:0 28px 44px -28px rgba(14,14,12,.4);}
.hj-card .tile{grid-row:1 / span 3; background:var(--cream); box-shadow:none; width:84px; height:84px;}
.hj-n{font-family:'Clash Display','Inter',sans-serif; color:var(--accent); font-size:15px; font-weight:600;}
.hj-card h3{font-size:22px; line-height:1.15;}
.hj-card p{font-size:15px; color:var(--ink-soft); margin:0; max-width:34ch;}
.hj-who{display:inline-block; margin-top:8px; font-size:12.5px; font-weight:700; color:var(--ink); background:var(--cream); border-radius:100px; padding:4px 12px; justify-self:start;}
.hj-card.key{background:var(--ink); color:#fff;}
.hj-card.key h3{color:#fff;} .hj-card.key p{color:#d6d4c9; max-width:none;}
.hj-card.key .tile{background:var(--accent);} .hj-card.key .tile .ic .acc{fill:#fff;}
.hj-card.key .hj-who{background:#2a2925; color:#fff;}
.hj-card.key ul{grid-column:1 / -1; list-style:none; margin:14px 0 0; padding:0;}
.hj-card.key li{font-size:14.5px; color:#e6e4da; padding:9px 0 9px 20px; border-top:1px solid #34332e; position:relative;}
.hj-card.key li::before{content:""; position:absolute; left:0; top:19px; width:9px; height:2px; background:var(--accent);}
.hj-card.key li b{color:#fff;}
@media (max-width:860px){
  .hj::before, .hj::after{left:27px;} .hj-mark{left:27px; width:46px; height:46px;} .hj-mark .ic{font-size:26px;}
  .hj-step, .hj-step.r{width:auto; margin-left:64px;} .hj-step::after, .hj-step.l::after, .hj-step.r::after{left:-45px; right:auto; top:40px;}
  .hj-card{grid-template-columns:1fr; padding:22px 22px 24px;} .hj-card .tile{grid-row:auto; width:72px; height:72px; margin-bottom:8px;}
}
.roles3{display:grid; grid-template-columns:repeat(3,1fr); gap:16px; margin-top:34px;}
.role3{background:#fff; border-radius:var(--radius-lg); padding:26px 26px 28px;}
.role3 .tile{background:var(--cream); box-shadow:none; margin-bottom:16px;}
.role3 h3{font-size:21px; margin-bottom:10px;}
.role3 li{font-size:14.5px; color:var(--ink-soft); padding:8px 0 8px 18px; position:relative; border-top:1px solid var(--line);}
.role3 li::before{content:""; position:absolute; left:0; top:17px; width:8px; height:1.5px; background:var(--ink-faint);}
@media (max-width:860px){ .roles3{grid-template-columns:1fr;} }
.stat3{display:grid; grid-template-columns:repeat(3,1fr); gap:16px; margin-top:34px;}
.stat3 > div{background:#fff; border-radius:var(--radius-lg); padding:26px; display:flex; flex-direction:column; gap:10px;}
.stat3 .ic{font-size:40px;} .stat3 b{font-family:'Clash Display','Inter',sans-serif; font-weight:500; font-size:clamp(34px,4vw,50px); line-height:1; color:var(--ink);} .stat3 span{font-size:14.5px; color:var(--ink-soft);}
@media (max-width:760px){ .stat3{grid-template-columns:1fr;} }

/* ---- business hub ---- */
.soon-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:18px; margin-top:34px;}
.soon{display:flex; flex-direction:column; gap:12px; background:#fff; border:1.5px dashed #cfc9ba; border-radius:var(--radius-lg); padding:28px 26px 28px;}
.soon .tile{background:var(--cream); box-shadow:none; margin-bottom:6px;}
.soon .badge-soon{align-self:flex-start; background:var(--accent-soft); font-weight:700; font-size:12.5px; padding:5px 12px; border-radius:100px;}
.soon h3{font-size:22px;} .soon p{font-size:15px; color:var(--ink-soft);}
.soon .btn{margin-top:auto; align-self:flex-start;}
@media (max-width:900px){ .soon-grid{grid-template-columns:1fr;} }

/* ---- About ---- */
.mega{font-family:'Clash Display','Inter',sans-serif; font-weight:600; font-size:clamp(54px,12.4vw,178px); line-height:.9; letter-spacing:-.025em; text-transform:uppercase; color:var(--ink);}
.mega .out{color:transparent; -webkit-text-stroke:2px var(--ink);}
.about-sec{padding:clamp(70px,9vw,130px) 0;}
.who-grid{display:grid; grid-template-columns:1.05fr 1fr; gap:clamp(30px,5vw,90px); margin-top:44px; align-items:start;}
.pull{font-family:'Clash Display','Inter',sans-serif; font-weight:500; font-size:clamp(26px,3.3vw,42px); line-height:1.14; color:var(--ink);}
.pull em{font-style:normal; background:linear-gradient(transparent 62%, var(--accent-soft) 62%);}
.who-text p{font-size:17px; max-width:56ch; margin-bottom:16px;}
@media (max-width:860px){ .who-grid{grid-template-columns:1fr;} }
.family-line{display:flex; gap:18px; align-items:center; margin-top:28px; padding:22px 24px; background:var(--accent-soft); border-radius:var(--radius-md);}
.family-line .ic{font-size:44px; flex-shrink:0;} .family-line p{margin:0; font-size:16px; color:var(--ink);}
.why-sec{background:var(--ink); color:#fff;}
.why-sec .mega{color:#fff;} .why-sec .mega .out{-webkit-text-stroke:2px #fff; color:transparent;}
.why-sec .lede{color:#c9c6b8; max-width:52ch; margin-top:22px;}
.why-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:14px; margin-top:48px;}
.why{position:relative; background:#1c1b18; border:1px solid #34332e; border-radius:var(--radius-lg); padding:28px 26px 30px; transition:transform .28s ease, border-color .28s ease, background .28s ease;}
.why:hover{transform:translateY(-8px); border-color:var(--accent); background:#232220;}
.why .ic{font-size:56px; color:#fff; margin-bottom:18px;} .why .ic .acc{fill:var(--accent);}
.why h3{color:#fff; font-size:22px; margin-bottom:8px;} .why p{color:#c9c6b8; font-size:15px; margin:0;}
.why .num{font-family:'Clash Display','Inter',sans-serif; font-weight:500; font-size:44px; color:var(--accent); line-height:1; display:block; margin-bottom:8px;}
@media (max-width:980px){ .why-grid{grid-template-columns:1fr 1fr;} } @media (max-width:600px){ .why-grid{grid-template-columns:1fr;} }
.facts-ic{display:grid; grid-template-columns:repeat(3,1fr); gap:30px 34px; margin-top:34px;}
.fact{display:flex; flex-direction:column; gap:12px;}
.fact .tile{background:var(--cream); box-shadow:none;}
.fact h3{font-size:19px;} .fact p{font-size:14.5px; color:var(--ink-soft); margin:0;}
@media (max-width:900px){ .facts-ic{grid-template-columns:1fr 1fr;} } @media (max-width:560px){ .facts-ic{grid-template-columns:1fr;} }
.counters{display:grid; grid-template-columns:repeat(4,1fr); gap:16px; margin-top:34px;}
.counters > div{border-top:2px solid var(--ink); padding-top:14px;}
.counters b{display:block; font-family:'Clash Display','Inter',sans-serif; font-weight:500; font-size:clamp(34px,4.6vw,60px); line-height:1; color:var(--ink);} .counters span{font-size:14px; color:var(--ink-soft);}
@media (max-width:760px){ .counters{grid-template-columns:1fr 1fr;} }
.certs-big{display:flex; align-items:center; justify-content:center; flex-wrap:wrap; gap:22px; margin-top:34px;}
.certs-big .iso{height:96px;} .certs-big .icc{height:88px; width:auto;}

/* ---- villa: technology + delivery ---- */
.tech{background:var(--ink); color:#fff;}
.tech h2{color:#fff; font-size:clamp(38px,6vw,84px); line-height:.98; letter-spacing:-.02em; max-width:14ch;}
.tech .lede{color:#c9c6b8; max-width:54ch; margin-top:18px;}
.tech-grid{display:grid; grid-template-columns:minmax(0,.92fr) minmax(0,1.3fr); gap:clamp(30px,5vw,72px); align-items:center; margin-top:40px;}
.tech-stats{display:flex; gap:14px 38px; flex-wrap:wrap; margin-bottom:28px;}
.tech-stat b{display:block; font-family:'Clash Display','Inter',sans-serif; font-weight:500; font-size:clamp(36px,4.4vw,56px); line-height:1; color:#fff;}
.tech-stat b small{font-size:.36em; color:var(--accent); margin-left:4px; font-weight:600;}
.tech-stat span{display:block; margin-top:6px; font-size:13px; color:#a9a698; max-width:15ch;}
.tech-list{list-style:none; margin:0; padding:0; counter-reset:t;}
.tech-list li{display:grid; grid-template-columns:40px 1fr; gap:2px 12px; padding:14px 0; border-top:1px solid #34332e; font-size:15px; color:#e6e4da; counter-increment:t;}
.tech-list li::before{content:counter(t, decimal-leading-zero); grid-row:1 / span 2; font-family:'Clash Display','Inter',sans-serif; color:var(--accent); font-size:15px; padding-top:2px;}
.tech-list li b{color:#fff; font-weight:700;} .tech-list li span{color:#a9a698; font-size:14px;}
.tech-render{position:relative;}
.tech-render .media{aspect-ratio:925/1086; border-radius:var(--radius-lg); background:#1c1b18;}
.tech-render .media > .img-placeholder{background:#1c1b18; border:1.5px dashed #4a483f; color:#a9a698;}
.tech-render .media > .img-placeholder svg{stroke:#a9a698;} .tech-render .media > .img-placeholder span{color:#a9a698;}
@media (max-width:900px){ .tech-grid{grid-template-columns:1fr;} }
.deliv-grid{display:grid; grid-template-columns:3.16fr 1fr; gap:18px; margin-top:34px; align-items:start;}
.deliv-grid.three{grid-template-columns:1fr 2.1fr 1fr;}
.deliv-grid .media{border-radius:var(--radius-lg); aspect-ratio:4/3;}
.vid-f{margin:0;}
.vid{position:relative; border-radius:var(--radius-lg); overflow:hidden; background:#111;}
.vid.land{aspect-ratio:16/9;} .vid.port{aspect-ratio:9/16;}
.vid video{display:block; width:100%; height:100%; object-fit:cover;}
.vid-f figcaption{margin-top:12px; font-size:14.5px; color:var(--ink-soft); display:flex; gap:10px; align-items:center;}
.vid-f figcaption .ic{font-size:26px; flex-shrink:0;}
@media (max-width:760px){ .deliv-grid{grid-template-columns:1fr;} .vid.port{max-width:320px;} }

/* ---- footer certificates, bottom right ---- */
.footer-certs{display:flex; align-items:center; gap:12px; flex-wrap:wrap;}
.footer-certs .iso{height:46px;} .footer-certs img.icc{height:46px; width:auto;}
.footer-certs .cert-txt{font-size:11px; padding:6px 9px; color:var(--ink-faint); border-color:#cfc9ba;}
.footer-bottom{align-items:center;}

/* ---- tiny details ---- */
.nav-dropdown a{white-space:nowrap;}
.center-h{text-align:center; margin-left:auto; margin-right:auto;}
.hj-card .tile .ic{font-size:50px;}
.footer-addresses.two{display:flex; flex-wrap:wrap; gap:24px 90px;}
.footer-certs .cert-txt{display:inline-block;}
.steps-ic.steps-3{grid-template-columns:repeat(3,1fr);}
@media (max-width:980px){ .steps-ic.steps-3{grid-template-columns:1fr;} }
.tech-stat > span{display:block; margin-top:6px; font-size:13px; color:#a9a698; max-width:15ch;}
.tech-stat b span{display:inline; margin:0; font-size:inherit; color:inherit; max-width:none;}
.pkg-incl ul{column-count:1;}
.plans.p2{grid-template-columns:1fr; max-width:640px;}
.plans.p2 .media{aspect-ratio:2/1;}

/* v9: backer photo cards, factory timelapses, narrower counters, photo timeline rows */
.backer{background:#fff; border-radius:var(--radius-lg); overflow:hidden; padding:0;}
.backer .media{border-radius:0; aspect-ratio:4/3;}
.backer-body{padding:22px 24px 26px;}
.backer-body h3{font-size:19px; margin-bottom:8px;}
.backer-body p{font-size:14.5px; color:var(--ink-soft); margin:0;}

.fac-vids{margin-bottom:40px;}
.counters.two{grid-template-columns:repeat(2,1fr); max-width:520px; margin-top:0;}

.tl-row.has-photo{grid-template-columns:120px 1fr 140px; align-items:center;}
.tl-photo{justify-self:end;}
.tl-photo .media{width:140px; aspect-ratio:4/3; border-radius:var(--radius-sm,10px);}
@media (max-width:700px){ .tl-row.has-photo{grid-template-columns:90px 1fr;} .tl-photo{grid-column:1/-1; justify-self:start; margin-top:10px;} .tl-photo .media{width:180px;} }

/* v9: multi-image galleries inside the Exterior / Interior views */
.gitem{position:absolute; inset:0; opacity:0; transition:opacity .35s ease;}
.gitem.on{opacity:1; z-index:1;}
.gitem img{width:100%; height:100%; object-fit:cover; display:block;}
/* v10: nav arrows are always visible -- a mouse user who never hovers the photo
   must still be able to see that it's a gallery, not just a single picture. */
.gal-prev, .gal-next{position:absolute; top:50%; transform:translateY(-50%); z-index:4; width:44px; height:44px; border-radius:50%; border:1.5px solid rgba(255,255,255,.7); background:rgba(14,14,12,.55); color:#fff; display:flex; align-items:center; justify-content:center; cursor:pointer; opacity:1; box-shadow:0 2px 10px rgba(0,0,0,.25); transition:background .2s, transform .15s;}
.gal-prev svg, .gal-next svg{width:20px; height:20px;}
.gal-prev{left:12px;} .gal-next{right:12px;}
.gal-prev:hover, .gal-next:hover{background:rgba(14,14,12,.8); transform:translateY(-50%) scale(1.06);}
.gal-dots{position:absolute; left:0; right:0; bottom:14px; z-index:4; display:flex; justify-content:center; gap:9px;}
.gal-dots span{width:9px; height:9px; border-radius:50%; background:rgba(255,255,255,.55); border:1px solid rgba(0,0,0,.15); cursor:pointer; transition:background .2s, transform .2s;}
.gal-dots span.on{background:#fff; transform:scale(1.3);}
.gal-count{position:absolute; right:12px; bottom:12px; z-index:4; font-size:11.5px; font-weight:700; color:#fff; background:rgba(14,14,12,.55); border-radius:100px; padding:3px 9px;}

@media (max-width:980px){ .deliv-grid.three{grid-template-columns:1fr 2.4fr;} .deliv-grid.three .vid-f:first-child{grid-column:1/-1;} .deliv-grid.three .vid-f:first-child .media{aspect-ratio:16/9;} }
@media (max-width:760px){ .deliv-grid.three{grid-template-columns:1fr;} .deliv-grid.three .vid-f:first-child{grid-column:auto;} }

/* v9: configurator buyer-type toggle + business note */
.buyer-toggle{display:flex; gap:8px; margin-top:16px;}
.buyer-toggle .pill{font-size:13.5px;}
.biz-note{background:var(--accent-soft); border-radius:var(--radius-md); padding:14px 18px; font-size:14px; color:var(--ink); margin-bottom:22px; max-width:70ch;}

/* v9: four location cards read better as a 2x2 grid than 3+1 */
.loc-grid{grid-template-columns:repeat(2,1fr);}
@media (max-width:700px){ .loc-grid{grid-template-columns:1fr;} }

/* v10: single featured live collection on the Business page (Tiny only, BnB moved to coming soon) */
.tiny-feature{display:grid; grid-template-columns:1.1fr 1fr; background:var(--cream); border-radius:var(--radius-lg); overflow:hidden; align-items:stretch;}
.tiny-feature .media{border-radius:0; aspect-ratio:auto; height:100%; min-height:320px;}
.tiny-feature .media img{object-position:center 25%;}
.tiny-feature-body{padding:clamp(28px,4vw,48px); display:flex; flex-direction:column; justify-content:center; gap:12px;}
.tiny-feature-body .loctag{align-self:flex-start;}
.tiny-feature-body h2{font-size:clamp(30px,3.6vw,44px);}
.tiny-feature-body p{font-size:16px; color:var(--ink-soft); max-width:40ch;}
.tiny-feature-body .coll-link{margin-top:10px; font-weight:700; font-size:15px; display:inline-flex; align-items:center; gap:8px;}
.tiny-feature-body .coll-link svg{width:14px; height:14px;}
.tiny-feature:hover .coll-link{text-decoration:underline;}
@media (max-width:800px){ .tiny-feature{grid-template-columns:1fr;} .tiny-feature .media{aspect-ratio:4/3; min-height:0;} }

/* v11: real wall-package photo -- native 1:1, keep its own ratio, no crop */
.tech-render .media img{object-fit:contain;}

/* v10: Dea's "your contact" card on the Villa Collection page */
.contact-card{display:grid; grid-template-columns:200px 1fr; gap:32px; align-items:center; background:var(--cream); border-radius:var(--radius-lg); padding:28px; max-width:900px;}
.contact-card .tphoto .media{border-radius:var(--radius-md); overflow:hidden;}
.contact-card-body .loctag{margin-bottom:10px;}
.contact-card-body h3{font-size:24px; margin-bottom:2px;}
.contact-card-body .role{font-size:14px; color:var(--ink-faint); font-weight:600; margin-bottom:14px;}
.contact-card-body p:not(.role){font-size:15px; color:var(--ink-soft); max-width:56ch; margin-bottom:18px;}
@media (max-width:640px){ .contact-card{grid-template-columns:110px 1fr; gap:20px; padding:20px;} }

/* v10: four coming-soon tiles read better as a 2x2 grid than 3+1 */
.soon-grid{grid-template-columns:repeat(2,1fr);}
@media (max-width:700px){ .soon-grid{grid-template-columns:1fr;} }

/* v11: persistent floating WhatsApp button, every page */
/* v10: icon + visible text -- the green circle alone only reads as "WhatsApp"
   to someone who already recognizes that logo; a plain-language label doesn't rely on that. */
.wa-float{position:fixed; right:22px; bottom:22px; z-index:60; height:52px; padding:0 20px 0 14px; border-radius:100px; background:#25D366; color:#fff; display:flex; align-items:center; gap:9px; box-shadow:0 10px 28px -8px rgba(37,211,102,.6); transition:transform .15s ease, box-shadow .15s ease;}
.wa-float svg{width:27px; height:27px; flex-shrink:0;}
.wa-float-label{font-size:15px; font-weight:700; white-space:nowrap;}
.wa-float:hover{transform:scale(1.05); box-shadow:0 14px 32px -8px rgba(37,211,102,.75);}
@media (max-width:760px){ .wa-float{right:16px; bottom:16px; height:48px; padding:0 16px 0 12px;} .wa-float svg{width:24px; height:24px;} .wa-float-label{font-size:14px;} }
@media (max-width:400px){ .wa-float{padding:0; width:48px; height:48px; justify-content:center;} .wa-float-label{display:none;} }
body:has(#stickyCta.show) .wa-float{bottom:92px;}

/* v11: the energy-savings figure is the visual hero of the calculator */
.calc-big.save-figure{font-size:clamp(56px,7.2vw,92px); line-height:1; height:auto; color:var(--accent); margin:10px 0 26px;}
.calc-big.save-figure small{font-size:18px;}

/* v11: facade step now uses wide rows too (was squished 3-up cards) -- size the photo properly */
.opt-grid.rows .media{width:220px; flex:0 0 220px; aspect-ratio:4/3; height:auto;}
.opt-grid.rows .opt-body{padding-left:20px;}
@media (max-width:620px){ .opt-grid.rows .opt{flex-direction:column; align-items:stretch;} .opt-grid.rows .media{width:100%; flex:none; aspect-ratio:16/9;} .opt-grid.rows .opt-body{padding-left:16px;} }

/* v11: fix -- team card role tag was inheriting the unrelated .role (how-it-works roles3) padding/border */
.team-card-v2 .tbody{padding:16px 4px 4px;}
.team-card-v2 .tbody h3{font-size:17px; margin:0 0 4px;}
.team-card-v2 .tbody .role{padding:0; border:none; font-size:13.5px; color:var(--ink-faint); font-weight:400;}

/* v11: 5-stat row for the expanded factory counters -- smaller than the 2-stat version, 5 columns need it */
.counters.five{grid-template-columns:repeat(5,1fr);}
.counters.five b{font-size:clamp(24px,2.6vw,34px);}
@media (max-width:900px){ .counters.five{grid-template-columns:repeat(2,1fr);} .counters.five b{font-size:clamp(26px,5vw,34px);} }

/* v11: ROI calculator "captured by opening sooner" callout */
.calc-callout{background:var(--accent-soft); border-radius:var(--radius-md); padding:14px 18px; margin:4px 0 20px; font-size:14px; color:var(--ink); display:flex; flex-wrap:wrap; align-items:baseline; gap:6px;}
.calc-callout b{font-family:'Clash Display','Inter',sans-serif; font-size:19px; font-weight:500; color:var(--ink);}
.calc-callout span{color:var(--ink-soft);}

/* v11: BAU Munich timeline entry uses a video, not an image -- size it like the photo slot */
.tl-photo .vid{width:140px; aspect-ratio:4/3; border-radius:var(--radius-sm,10px); overflow:hidden;}
.tl-photo .vid video{width:100%; height:100%; object-fit:cover;}
@media (max-width:700px){ .tl-photo .vid{width:180px;} }

/* v11: fix -- Dea's longer CTA text was forcing the contact card to overflow on mobile */
.contact-card-body{min-width:0;}
.contact-card-body .mdl-actions .btn{white-space:normal; text-align:left; line-height:1.3;}

/* v11: fix -- the generic .stat3 span caption rule was also catching the counted-number spans nested in <b> */
.stat3 b span{font-size:inherit; color:inherit;}

/* v12: prominent WhatsApp icon on the "Message us" CTA */
.btn-wa{display:inline-flex; align-items:center; gap:10px;}
.btn-wa svg{width:26px; height:26px; flex:none; color:#25D366;}

/* v12: "See it built" real-photo strip, Trio only -- render-led card, real photos one click away */
.built-strip{margin-top:18px; border-top:1px solid var(--line); padding-top:16px;}
.built-strip summary{cursor:pointer; font-weight:700; font-size:14.5px; color:var(--ink); list-style:none; display:flex; align-items:center; gap:8px;}
.built-strip summary::-webkit-details-marker{display:none;}
.built-strip summary::before{content:"\2605"; color:var(--accent); font-size:12px;}
.built-strip summary span{font-weight:500; color:var(--ink-faint); font-size:13px;}
.built-row{position:relative; display:flex; gap:10px; overflow-x:auto; margin-top:14px; padding-bottom:4px; box-shadow:inset -24px 0 16px -16px rgba(14,14,12,.12);}
.built-row img{width:140px; height:105px; flex:none; object-fit:cover; border-radius:var(--radius-sm,10px);}

/* v12: Tiny House page -- mega 60-day stat callout */
.mega-stat{border-top:2px solid var(--ink); padding-top:20px; display:grid; grid-template-columns:auto 1fr; gap:28px; align-items:center;}
.mega-stat b{font-family:'Clash Display','Inter',sans-serif; font-weight:500; font-size:clamp(56px,9vw,120px); line-height:1; color:var(--accent); white-space:nowrap;}
.mega-stat p{font-size:17px; max-width:46ch; color:var(--ink-soft);}
@media (max-width:700px){ .mega-stat{grid-template-columns:1fr; gap:10px;} }

/* v12: Tiny House build-journey mosaic -- a real grid, not a slider */
.journey-grid{display:grid; grid-template-columns:repeat(6,1fr); grid-auto-rows:110px; gap:10px; margin-top:32px;}
.journey-item{border-radius:var(--radius-sm,10px); overflow:hidden; grid-column:span 2; grid-row:span 1;}
.journey-item.big{grid-column:span 3; grid-row:span 2;}
.journey-item.big.tall{grid-row:span 3;}
.journey-item img{width:100%; height:100%; object-fit:cover; display:block; transition:transform .4s ease;}
.journey-item:hover img{transform:scale(1.04);}
@media (max-width:860px){
  .journey-grid{grid-template-columns:repeat(4,1fr); grid-auto-rows:90px;}
  .journey-item{grid-column:span 2;}
  .journey-item.big{grid-column:span 4; grid-row:span 2;}
  .journey-item.big.tall{grid-row:span 2;}
}
@media (max-width:500px){
  .journey-grid{grid-template-columns:repeat(2,1fr); grid-auto-rows:140px;}
  .journey-item, .journey-item.big{grid-column:span 2; grid-row:span 1;}
  .journey-item.big.tall{grid-row:span 2;}
}

/* v12: express-manufacturing toggle -- Villa (radio pair) and Tiny (checkbox) both use this */
.express-toggle{display:flex; align-items:flex-start; gap:14px; border:1.5px solid var(--line); border-radius:var(--radius-md); padding:16px 18px; margin-top:12px; cursor:pointer; transition:border-color .15s, background .15s;}
.express-toggle input{margin-top:3px; accent-color:var(--ink); flex:none;}
.express-toggle:has(input:checked){border-color:var(--ink); background:var(--accent-soft);}
.express-toggle.off{margin-top:8px;}
.express-box{display:flex; flex-direction:column; gap:3px;}
.express-box b{font-size:14.5px; color:var(--ink);}
.express-box span{font-size:13px; color:var(--ink-faint);}

/* v12: units stepper on the Tiny configurator */
.order-row{display:flex; align-items:flex-end; gap:24px; flex-wrap:wrap;}
.stepper{display:inline-flex; align-items:center; gap:0; border:1.5px solid var(--line); border-radius:100px; overflow:hidden; width:fit-content;}
.stepper button{width:42px; height:42px; border:none; background:#fff; font-size:19px; font-weight:700; cursor:pointer; color:var(--ink); line-height:1;}
.stepper button:hover{background:var(--cream);}
.stepper span{min-width:36px; text-align:center; font-weight:700; font-size:15px;}

/* v13: simplification pass -- make every "this expands" affordance unambiguous */
.pkg-more summary{display:flex; align-items:center; gap:7px;}
.pkg-more summary::after{content:"+"; font-size:16px; font-weight:700; line-height:1;}
.pkg-more[open] summary::after{content:"\2212";}
.built-strip summary::after{content:"+"; margin-left:auto; font-size:18px; font-weight:700; color:var(--accent);}
.built-strip[open] summary::after{content:"\2212";}
.acc-trigger .icon::before, .acc-trigger .icon::after{height:2.2px;}
.acc-trigger .icon::before{width:15px;} .acc-trigger .icon::after{width:2.2px; height:15px;}

/* stronger outline button -- was the weakest-looking variant at a glance */
.btn-outline{border-width:2px; font-weight:700;}
.btn-outline:hover{background:var(--ink); color:#fff; border-color:var(--ink);}

/* nav links read more clearly as nav, not body text, now that dropdowns are gone */
.nav-links > a{font-weight:600;}