/* home.css — home page only. Language: bento. Uses tokens.css names; classes are prefixed (hb ms pj dc lp wb ss ib fq). */

.hm{overflow-x:clip;color:var(--ink);font-family:var(--font)}
.hm :where(h1,h2,h3,p,ul,ol,dl,dd,figure){margin:0}
.hm :where(ul,ol){padding:0;list-style:none}
.hm :where(a){color:inherit}
.hm img{display:block;max-width:100%}

/* shared pieces ------------------------------------------------------------- */
.hm-kicker{font:500 12px/1.3 var(--mono);letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}
.hm h1,.hm h2,.hm h3{font-family:var(--font);color:inherit}
.hm h2{font-weight:800;font-size:clamp(1.9rem,1rem + 2.6vw,3.2rem);line-height:1.04;letter-spacing:-.03em;text-wrap:balance}
.hm h3{font-weight:800;letter-spacing:-.02em;line-height:1.1}
.hm-head{max-width:780px;margin-bottom:clamp(28px,4vw,52px)}
.hm-head .hm-kicker{margin-bottom:14px}
.hm-sub{margin-top:16px;font-size:clamp(1rem,.95rem + .2vw,1.1rem);line-height:1.6;color:var(--ink-2);max-width:60ch}
.hm-head-row{max-width:none;display:flex;justify-content:space-between;align-items:flex-end;gap:20px 32px;flex-wrap:wrap}
.hm-head-row > div{max-width:760px}

.hm-mark{position:relative;white-space:nowrap}
.hm-mark::after{content:"";position:absolute;left:0;right:0;bottom:-.06em;height:.15em;background:var(--lime);transform-origin:left;animation:jh-draw 1s var(--ease) .6s both}
.hb-hero .hm-mark::after{background:var(--blue)}

.hm-btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:48px;padding:0 22px;border-radius:14px;border:1.5px solid transparent;font:700 15px/1 var(--font);text-decoration:none;cursor:pointer;transition:background-color .2s var(--ease),color .2s var(--ease),border-color .2s var(--ease)}
.hm-btn svg{flex:none}
.hm .hm-btn-blue{background:var(--blue);color:#fff}
.hm .hm-btn-blue:hover{background:var(--blue-d)}
.hm .hm-btn-line{border-color:var(--ink);color:var(--ink);background:transparent}
.hm .hm-btn-line:hover{background:var(--ink);color:#fff}
.hm .hm-btn-lime{background:var(--lime);color:var(--ink)}
.hm .hm-btn-lime:hover{background:var(--lime-d)}

.hm-link{display:inline-flex;align-items:center;gap:8px;min-height:44px;font-weight:700;text-decoration:underline;text-decoration-thickness:1.5px;text-underline-offset:4px}
.hm-link:hover{text-decoration-thickness:3px}

.hm a:focus-visible,.hm button:focus-visible,.hm summary:focus-visible{outline:2px solid var(--blue);outline-offset:2px}
.ms a:focus-visible,.ms button:focus-visible,.lp a:focus-visible,.ib a:focus-visible,.hb-search :focus-visible,.hb-lic:focus-visible,.pj-flow a:focus-visible,.wb-c  a:focus-visible,.wb-c button:focus-visible,.dc-cloud a:focus-visible{outline-color:var(--lime)}
.hb-search input:focus-visible{outline:none}

/* tile: radius, lift on hover (translate is separate from the reveal transform) */
.hm .tile,html.js .hm .tile.reveal{transition:opacity .6s var(--ease),transform .6s var(--ease),translate .25s var(--ease),box-shadow .25s var(--ease)}
.hm .tile{position:relative;border-radius:var(--r-l);background:var(--surface);overflow:hidden}
.hm .tile:hover{translate:0 -4px;box-shadow:var(--shadow-up);transition-delay:0s}

/* 1 · workspace-bento ------------------------------------------------------- */
.hb{position:relative;isolation:isolate;padding:clamp(14px,2.2vw,28px) 0 clamp(40px,6vw,72px)}
.hb-blob{position:absolute;z-index:-1;border-radius:50%;filter:blur(70px);pointer-events:none;animation:jh-drift 16s ease-in-out infinite}
.hb-blob-a{width:min(46vw,640px);aspect-ratio:1;left:-8%;top:-4%;background:var(--lime);opacity:.55}
.hb-blob-b{width:min(40vw,560px);aspect-ratio:1;right:-6%;top:10%;background:var(--sky-d);opacity:.8;animation-duration:22s;animation-direction:reverse}

.hb-grid{display:grid;gap:16px;grid-template-columns:1.35fr 1fr .85fr .85fr;
  grid-template-areas:"hero hero sketch sketch" "hero hero sketch sketch" "photo cloud search lic"}
.hb-hero{grid-area:hero;display:flex;flex-direction:column;justify-content:center;gap:0;padding:clamp(24px,3.2vw,48px);background:rgba(255,255,255,.66);border:1px solid rgba(255,255,255,.9);-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px)}
.hb-hero h1{margin-top:18px;font-weight:800;font-size:clamp(2.05rem,1rem + 2.9vw,3.6rem);line-height:1.02;letter-spacing:-.035em;text-wrap:balance}
.hb-lead{margin-top:32px;max-width:46ch;font-size:clamp(1.02rem,.95rem + .3vw,1.2rem);line-height:1.55;color:var(--ink-2)}
.hb-cta{display:flex;flex-wrap:wrap;gap:12px;margin-top:28px}
.hb-fine{margin-top:26px;font:500 12px/1.5 var(--mono);letter-spacing:.04em;color:var(--muted)}

.hb-sketch{grid-area:sketch;display:flex;padding:clamp(12px,1.6vw,22px);background:var(--sky)}
.sk{flex:1;min-width:0;display:flex;flex-direction:column;background:var(--surface);border-radius:var(--r-m);box-shadow:var(--shadow);overflow:hidden}
.sk-bar{display:flex;align-items:center;gap:6px;padding:11px 14px;border-bottom:1px solid var(--line)}
.sk-bar > i{width:10px;height:10px;border-radius:50%;background:var(--line-strong)}
.sk-tabs{margin-left:auto;display:flex;gap:4px;font:500 12px/1 var(--mono)}
.sk-tabs b{padding:6px 10px;border-radius:8px;font-weight:500;color:var(--muted)}
.sk-tabs b.on{background:var(--ink);color:#fff}
.sk-lab{display:block;font:500 12px/1 var(--mono);letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.sk i{display:block;height:6px;border-radius:3px;background:var(--line-strong)}
.sk .w35{width:35%}.sk .w40{width:40%}.sk .w50{width:50%}.sk .w55{width:55%}.sk .w60{width:60%}.sk .w65{width:65%}.sk .w70{width:70%}.sk .w75{width:75%}.sk .w80{width:80%}
.sk-board{flex:1;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;padding:14px}
.sk-col{display:grid;align-content:start;gap:8px;padding:10px;border-radius:12px;background:var(--surface-2)}
.sk-card{position:relative;display:grid;gap:6px;padding:10px 10px 22px;border:1px solid var(--line);border-radius:10px;background:#fff}
.sk-card em{position:absolute;right:9px;bottom:8px;width:14px;height:10px;border-radius:4px}
.sk .c-sky{background:var(--sky-d)}.sk .c-blue{background:var(--blue)}.sk .c-lime{background:var(--lime-d)}
.sk-card.is-live{border-color:var(--blue);animation:jh-pulse 2.4s ease-in-out infinite}
.sk-low{display:grid;grid-template-columns:1.25fr 1fr;gap:10px;padding:0 14px 14px}
.sk-ledger,.sk-route{display:grid;align-content:start;gap:8px;padding:10px;border-radius:12px;background:var(--surface-2)}
.sk-row{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:6px 8px;border:1px solid var(--line);border-radius:8px;background:#fff}
.sk-row i{flex:0 1 auto;min-width:10px}
.st{padding:4px 7px;border-radius:6px;font:500 12px/1 var(--mono);color:var(--ink)}
.st-d{background:var(--sky)}.st-r{background:var(--blue);color:#fff}.st-a{background:var(--lime)}
.sk-path{display:flex;align-items:center;margin:18px 4px 10px}
.sk-path .nd{flex:none;width:18px;height:18px;border-radius:50%;border:2px solid var(--ink);background:#fff}
.sk-path .nd.on{background:var(--blue);border-color:var(--blue);animation:jh-pulse 2s ease-in-out infinite}
.sk-path .ln{flex:1;height:2px;background:var(--ink);transform-origin:left;animation:jh-draw 1.1s var(--ease) .4s both}
.sk-path span:nth-child(4){animation-delay:1s}
.sk-names{display:flex;justify-content:space-between;gap:4px;font:500 12px/1.2 var(--mono);color:var(--ink-2)}

.hb-photo{grid-area:photo;margin:0;min-height:220px}
.hb-photo img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.hb-photo figcaption{position:absolute;left:12px;bottom:12px;padding:8px 12px;border-radius:10px;background:var(--surface);font:500 12px/1 var(--mono);letter-spacing:.06em;text-transform:uppercase;color:var(--ink)}

.hm a.tile{text-decoration:none;display:flex;flex-direction:column;padding:24px;min-height:220px}
.hb-tile-h{font-weight:800;font-size:clamp(1.3rem,1rem + .8vw,1.75rem);line-height:1.1;letter-spacing:-.025em}
.hb-tile-p{font-size:15px;line-height:1.45}
.hb-cloud{grid-area:cloud;background:var(--lime)!important;color:var(--ink)}
.hb-cloud .hm-kicker{color:var(--ink-2);margin-bottom:12px}
.hb-cloud .hb-tile-p{margin-top:8px;color:var(--ink-2)}
.hb-go{margin-top:auto;align-self:flex-end;display:grid;place-items:center;width:44px;height:44px;border-radius:14px;background:var(--ink);color:var(--lime);transition:transform .25s var(--ease)}
.hb-cloud:hover .hb-go{transform:translateX(4px)}

.hb-search{grid-area:search;display:flex;flex-direction:column;padding:24px;min-height:220px;background:var(--blue)!important;color:#fff}
.hb-search .hb-tile-p{margin-top:8px;color:#fff;opacity:.92}
.hb-field{display:flex;margin-top:auto;padding-top:0;border-radius:14px;overflow:hidden;background:#fff}
.hb-field:focus-within{outline:2px solid var(--lime);outline-offset:2px}
.hb-field input{flex:1;min-width:0;height:48px;padding:0 14px;border:0;background:transparent;font:500 16px/1 var(--font);color:var(--ink)}
.hb-field input::placeholder{color:var(--muted);opacity:1}
.hb-field button{flex:none;width:48px;height:48px;display:grid;place-items:center;border:0;background:var(--ink);color:#fff;cursor:pointer}
.hb-field button:hover{background:var(--navy-2)}

.hb-lic{grid-area:lic;background:var(--navy)!important;color:var(--on-navy);justify-content:space-between}
.hb-lic-n{font-weight:800;font-size:clamp(3.2rem,2rem + 3vw,4.8rem);line-height:.9;letter-spacing:-.04em;color:var(--lime)}
.hb-lic-n small{margin-left:8px;font:500 12px/1 var(--mono);letter-spacing:.1em;text-transform:uppercase;color:var(--on-navy-muted)}
.hb-lic-t{font-size:15px;line-height:1.45;color:var(--on-navy)}

/* 2 · module-strip ------------------------------------------------------------ */
.ms{background:var(--navy);color:var(--on-navy);padding:clamp(40px,5vw,68px) 0 clamp(44px,5vw,68px);overflow:hidden}
.ms-head{display:flex;justify-content:space-between;align-items:flex-end;gap:20px 40px;flex-wrap:wrap;margin-bottom:clamp(24px,3vw,36px)}
.ms .hm-kicker{color:var(--on-navy-muted);margin-bottom:12px}
.ms h2{max-width:26ch;font-size:clamp(1.5rem,1rem + 1.6vw,2.3rem);color:var(--on-navy)}
.ms-pause{display:inline-flex;align-items:center;gap:10px;min-height:44px;padding:0 16px;border:1.5px solid var(--on-navy-muted);border-radius:14px;background:transparent;color:var(--on-navy);font:500 13px/1 var(--mono);cursor:pointer}
.ms-pause:hover{background:var(--navy-2)}
html:not(.js) .ms-pause{display:none}
.ms-rows{display:grid;gap:14px}
.ms-row{overflow:hidden;-webkit-mask-image:linear-gradient(90deg,transparent,#000 5%,#000 95%,transparent);mask-image:linear-gradient(90deg,transparent,#000 5%,#000 95%,transparent)}
.ms-track{display:flex;width:max-content;animation:jh-marquee 100s linear infinite}
.ms-row.is-rev .ms-track{animation-direction:reverse;animation-duration:120s}
.ms:hover .ms-track,.ms:focus-within .ms-track,.ms.is-paused .ms-track{animation-play-state:paused}
.ms-set{display:flex;flex:none}
.ms-chip{display:flex;align-items:center;gap:12px;height:56px;margin-right:14px;padding:0 22px;border:1px solid rgba(241,240,235,.28);border-radius:14px;font-weight:600;font-size:17px;line-height:1;white-space:nowrap;color:var(--on-navy)}
.ms-chip.is-lime{background:var(--lime);border-color:var(--lime);color:var(--ink)}
.ms-dot{width:8px;height:8px;border-radius:50%;background:var(--lime)}
.is-lime .ms-dot{background:var(--ink)}

/* 3 · pick-by-job ------------------------------------------------------------- */
.pj{padding:clamp(56px,8vw,112px) 0 clamp(40px,6vw,80px)}
.pj-grid{display:grid;gap:16px;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);grid-template-areas:"proj led" "proj flow"}
.pj-proj{grid-area:proj;display:flex;flex-direction:column}
.pj-led{grid-area:led;background:var(--sky)!important;display:grid;grid-template-columns:minmax(0,.34fr) minmax(0,1fr)}
.pj-flow{grid-area:flow;background:var(--navy)!important;color:var(--on-navy)}
.pj-proj > img{width:100%;flex:1 1 auto;min-height:clamp(200px,20vw,280px);object-fit:cover}
.pj-led > img{width:100%;height:100%;object-fit:cover}
.pj-body{padding:clamp(22px,2.4vw,32px)}
.pj-body h3{margin-top:10px;font-size:clamp(1.6rem,1.2rem + 1vw,2.2rem)}
.pj-p{margin-top:10px;max-width:46ch;font-size:15.5px;line-height:1.55;color:var(--ink-2)}
.pj-from{margin-top:16px;font:500 12px/1 var(--mono);letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.pj-from b{margin-left:4px;font:800 28px/1 var(--font);letter-spacing:-.02em;text-transform:none;color:var(--ink)}
.pj-tiers{margin-top:14px}
.pj-tiers a{display:grid;grid-template-columns:minmax(0,1fr) auto 20px;align-items:center;gap:12px;min-height:56px;margin:0 -12px;padding:8px 12px;border-top:1px solid var(--line);text-decoration:none;transition:background-color .2s var(--ease)}
.pj-tiers a:hover{background:rgba(14,26,58,.06)}
.pj-t{display:grid;gap:3px;min-width:0}
.pj-t b{font-weight:700;font-size:16px;line-height:1.2}
.pj-t b i{margin-left:6px;font:500 12px/1 var(--mono);letter-spacing:.06em;text-transform:uppercase;color:var(--ink-2)}
.pj-t small{font:400 12.5px/1.3 var(--mono);color:var(--muted)}
.pj-pr{font:600 17px/1 var(--mono)}
.pj-tiers svg{width:18px;height:18px;transition:transform .2s var(--ease)}
.pj-tiers a:hover svg{transform:translateX(3px)}
.pj-led .hm-kicker,.pj-led .pj-p,.pj-led .pj-from,.pj-led .pj-t small,.pj-led .pj-t b i{color:var(--ink-2)}
.pj-led .pj-tiers a{border-top-color:rgba(14,26,58,.2)}
.pj-flow .hm-kicker,.pj-flow .pj-from,.pj-flow .pj-t small{color:var(--on-navy-muted)}
.pj-flow .pj-p{color:var(--on-navy)}
.pj-flow .pj-from b{color:var(--on-navy)}
.pj-flow .pj-tiers a{border-top-color:rgba(241,240,235,.2)}
.pj-flow .pj-tiers a:hover{background:rgba(241,240,235,.08)}
.pj-route{position:absolute;right:clamp(16px,2vw,28px);top:clamp(16px,2vw,26px);width:clamp(120px,12vw,170px);height:auto;color:var(--lime)}
.pj-route-line{stroke-dasharray:3 6}

/* 4 · desk-or-cloud ------------------------------------------------------------- */
.dc{padding:clamp(40px,6vw,80px) 0 clamp(56px,8vw,104px)}
.dc-grid{display:grid;gap:16px;grid-template-columns:.8fr 1.35fr 1fr;align-items:stretch}
.dc-photo{position:relative;min-height:540px;margin:0 0 0 calc(-1 * (max(0px,(100vw - var(--wrap)) / 2) + var(--gutter)));border-radius:0 var(--r-l) var(--r-l) 0;overflow:hidden}
.dc-photo img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.dc-panel{display:flex;flex-direction:column;padding:clamp(22px,2.4vw,34px)}
.dc-panel h3{margin-top:10px;font-size:clamp(1.55rem,1.15rem + 1vw,2.1rem)}
.dc-lede{margin-top:14px;font-size:16px;line-height:1.5;color:var(--ink-2)}
.dc-lede b{font-family:var(--mono);font-weight:600;color:var(--ink)}
.dc-dl{margin-top:22px;display:grid}
.dc-dl > div{display:grid;gap:6px;padding:14px 0;border-top:1px solid var(--line)}
.dc-dl dt{font:500 12px/1.3 var(--mono);letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.dc-dl dd{font-size:15.5px;line-height:1.5}
.dc-dl dd b{font-family:var(--mono);font-weight:600}
.dc-foot{margin-top:auto;padding-top:18px;display:flex;flex-wrap:wrap;gap:4px 24px}
.dc-cloud{padding:0;background:var(--blue)!important;color:#fff}
.dc-cloud > img{width:100%;height:170px;object-fit:cover}
.dc-cbody{display:flex;flex-direction:column;flex:1;padding:clamp(22px,2.4vw,30px)}
.dc-cloud .hm-kicker{color:var(--sky)}
.dc-cloud .dc-dl > div{border-top-color:rgba(255,255,255,.28)}
.dc-cloud .dc-dl dt{color:var(--sky)}

/* 5 · licence-path -------------------------------------------------------------- */
.lp{background:var(--navy);color:var(--on-navy);padding:clamp(64px,9vw,128px) 0}
.lp-in{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);gap:clamp(32px,6vw,96px);align-items:start}
.lp-side{position:sticky;top:112px}
.lp .hm-kicker{color:var(--on-navy-muted);margin-bottom:14px}
.lp h2{color:var(--on-navy)}
.lp-p{margin-top:18px;max-width:40ch;font-size:17px;line-height:1.6;color:var(--on-navy-muted)}
.lp-side img{width:100%;aspect-ratio:16/10;object-fit:cover;margin:28px 0 14px;border-radius:var(--r-m)}
.lp .hm-link{color:var(--on-navy)}
.lp-steps{display:grid;gap:16px}
.lp-step{display:grid;grid-template-columns:76px minmax(0,1fr);gap:20px;align-content:center;min-height:210px;padding:clamp(24px,3vw,40px);border:1px solid rgba(241,240,235,.12);border-radius:var(--r-l);background:var(--navy-2)}
.lp-step:nth-child(even){margin-left:clamp(0px,4vw,56px)}
.lp-step:nth-child(odd){margin-right:clamp(0px,2vw,24px)}
.lp-step:nth-child(3){min-height:250px}
.lp-n{font:800 clamp(2rem,1.4rem + 1.6vw,3rem)/1 var(--mono);letter-spacing:-.04em;color:var(--lime)}
.lp-step h3{font-size:clamp(1.35rem,1.1rem + .8vw,1.8rem);color:var(--on-navy)}
.lp-step p{margin-top:10px;max-width:52ch;font-size:16px;line-height:1.6;color:var(--on-navy-muted)}
.lp-step:last-child{background:var(--lime);border-color:var(--lime)}
.lp-step:last-child .lp-n,.lp-step:last-child h3,.lp-step:last-child p{color:var(--ink)}
.lp-step:last-child p{color:var(--ink-2)}

/* 6 · workspace-builder --------------------------------------------------------- */
.wb{padding:clamp(56px,8vw,104px) 0 clamp(48px,7vw,96px)}
.wb-grid{display:grid;gap:16px;grid-template-columns:repeat(12,minmax(0,1fr))}
.wb-a{grid-column:span 7}
.wb-b{grid-column:span 5;background:var(--lime)!important}
.wb-c{grid-column:span 12;background:var(--navy)!important;color:var(--on-navy)}
.wb-item{display:flex;flex-direction:column;gap:22px;padding:clamp(22px,2.6vw,36px)}
.wb-top h3{margin-top:10px;font-size:clamp(1.5rem,1.1rem + 1vw,2.1rem)}
.wb-note{margin-top:10px;max-width:46ch;font-size:15.5px;line-height:1.55;color:var(--ink-2)}
.wb-b .hm-kicker{color:var(--ink-2)}
.wb-parts{display:grid;gap:10px}
.wb-parts li{display:grid;grid-template-columns:56px minmax(0,1fr) auto;align-items:center;gap:14px;padding:10px;border-radius:var(--r-m);background:var(--surface-2)}
.wb-th{width:56px;height:56px;border-radius:12px;object-fit:cover}
.wb-th-mod{display:grid;place-items:center;background:var(--sky);color:var(--blue-d)}
.wb-nm{display:grid;gap:3px;min-width:0}
.wb-nm a{font-weight:700;font-size:16px;line-height:1.25}
.wb-nm small{font:400 12.5px/1.3 var(--mono);color:var(--muted)}
.wb-pr{font:600 17px/1 var(--mono)}
.wb-buy{margin-top:auto;display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:14px 24px}
.wb-total{display:grid;gap:6px}
.wb-total small{font:500 12px/1.3 var(--mono);letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
.wb-total b{font:800 clamp(1.9rem,1.3rem + 1.8vw,2.7rem)/1 var(--font);letter-spacing:-.03em;font-variant-numeric:tabular-nums}
.wb-b .wb-parts li{background:rgba(255,255,255,.62)}
.wb-b .wb-nm small,.wb-b .wb-total small{color:var(--ink-2)}
.wb-c .hm-kicker,.wb-c .wb-nm small,.wb-c .wb-total small{color:var(--on-navy-muted)}
.wb-c .wb-note{color:var(--on-navy)}
.wb-c .wb-parts li{background:var(--navy-2)}
.wb-c .wb-th-mod{background:var(--lime);color:var(--ink)}
.wb-c .wb-nm a{color:var(--on-navy)}

/* 7 · suite-saving -------------------------------------------------------------- */
.ss{padding:clamp(48px,7vw,96px) 0 clamp(56px,8vw,112px)}
.ss-grid{display:grid;gap:clamp(24px,4vw,56px);grid-template-columns:minmax(0,1.5fr) minmax(0,.9fr);align-items:stretch}
.ss-main .hm-head{margin-bottom:28px}
.ss-tablewrap{padding:6px clamp(14px,2vw,28px) 10px}
.ss-table{width:100%;border-collapse:collapse;table-layout:fixed}
.ss-table th,.ss-table td{padding:16px 10px;text-align:left;vertical-align:top;border-bottom:1px solid var(--line)}
.ss-table thead th{padding-top:20px;font-weight:800;font-size:clamp(1rem,.9rem + .4vw,1.2rem);line-height:1.2;letter-spacing:-.01em}
.ss-table thead a{text-decoration:underline;text-decoration-thickness:1.5px;text-underline-offset:4px}
.ss-table thead th:first-child,.ss-table tbody th{width:26%}
.ss-table tbody th{font:500 12px/1.4 var(--mono);letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.ss-table td{display:table-cell}
.ss-table td span{display:block;font-size:13.5px;line-height:1.35;color:var(--ink-2)}
.ss-table td b{display:block;margin-top:4px;font:600 18px/1.2 var(--mono);font-variant-numeric:tabular-nums}
.ss-sum td b{color:var(--ink-2);font-weight:500}
.ss-suite td b{font-weight:700}
.ss-table .ss-save th,.ss-table .ss-save td{background:var(--lime);border-bottom:0;color:var(--ink)}
.ss-table .ss-save th{color:var(--ink);border-radius:var(--r-s) 0 0 var(--r-s)}
.ss-table .ss-save td:last-child{border-radius:0 var(--r-s) var(--r-s) 0}
.ss-table .ss-save td b{font-size:22px;font-weight:800;margin-top:0}
.ss-note{margin-top:20px;max-width:64ch;font-size:15px;line-height:1.6;color:var(--ink-2)}
.ss-photo{position:relative;margin:0;min-height:460px;border-radius:var(--r-l);overflow:hidden}
.ss-photo img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.ss-photo figcaption{position:absolute;left:14px;right:14px;bottom:14px;display:grid;gap:8px;padding:18px 20px;border-radius:var(--r-m);background:var(--surface);box-shadow:var(--shadow)}
.ss-photo figcaption b{font:800 clamp(1.8rem,1.3rem + 1.5vw,2.6rem)/1 var(--font);letter-spacing:-.03em;font-variant-numeric:tabular-nums}

/* 8 · ireland-band --------------------------------------------------------------- */
.ib{position:relative;isolation:isolate;display:flex;align-items:center;min-height:clamp(420px,50vw,600px);background:var(--navy);color:#fff}
.ib > img{position:absolute;inset:0;z-index:-2;width:100%;height:100%;object-fit:cover;object-position:50% 60%}
.ib::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,rgba(14,26,58,.94) 0%,rgba(14,26,58,.8) 42%,rgba(14,26,58,.08) 78%)}
.ib-in{width:100%;padding-top:56px;padding-bottom:56px}
.ib-card{max-width:560px}
.ib .hm-kicker{color:var(--on-navy-muted);margin-bottom:14px}
.ib h2{color:#fff;font-size:clamp(2rem,1.1rem + 3vw,3.6rem)}
.ib-card p:not(.hm-kicker){margin:18px 0 28px;max-width:44ch;font-size:clamp(1.05rem,1rem + .3vw,1.25rem);line-height:1.55;color:var(--on-navy)}

/* 9 · buyer-faq ------------------------------------------------------------------- */
.fq{padding:clamp(56px,8vw,104px) 0 clamp(64px,9vw,128px)}
.fq-head{display:flex;justify-content:space-between;align-items:flex-end;gap:24px;margin-bottom:clamp(24px,3vw,40px)}
.fq-head .hm-kicker{margin-bottom:14px}
.fq-photo{flex:none;width:min(30vw,300px);aspect-ratio:3/2;border-radius:var(--r-l);overflow:hidden}
.fq-photo img{width:100%;height:100%;object-fit:cover}
.fq-cols{display:grid;gap:0 clamp(24px,4vw,64px);grid-template-columns:repeat(2,minmax(0,1fr));align-items:start}
.fq-item{border-top:1.5px solid var(--ink)}
.fq-col:last-child .fq-item:last-child,.fq-col:first-child .fq-item:last-child{border-bottom:1.5px solid var(--ink)}
.fq-item summary{display:flex;justify-content:space-between;align-items:flex-start;gap:16px;min-height:56px;padding:20px 0;font-weight:700;font-size:clamp(1.02rem,.95rem + .3vw,1.15rem);line-height:1.35;cursor:pointer;list-style:none}
.fq-item summary::-webkit-details-marker{display:none}
.fq-item summary i{position:relative;flex:none;width:22px;height:22px;margin-top:2px}
.fq-item summary i::before,.fq-item summary i::after{content:"";position:absolute;left:3px;right:3px;top:10px;height:2px;border-radius:1px;background:var(--ink);transition:transform .25s var(--ease)}
.fq-item summary i::after{transform:rotate(90deg)}
.fq-item[open] summary i::after{transform:rotate(0)}
.fq-item p{padding:0 40px 24px 0;max-width:60ch;font-size:16px;line-height:1.65;color:var(--ink-2)}

/* responsive (after base rules) ------------------------------------------------------ */
@media (max-width:1100px){
  .hb-grid{grid-template-columns:1fr 1fr;grid-template-areas:"hero hero" "sketch sketch" "photo cloud" "search lic"}
  .hb-sketch{min-height:0}
  .pj-grid{grid-template-columns:minmax(0,1fr);grid-template-areas:"proj" "led" "flow"}
  .pj-proj{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr)}
  .pj-proj > img{height:100%;min-height:260px}
  .dc-grid{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
  .dc-photo{grid-column:1 / -1;min-height:300px;margin:0 calc(-1 * (max(0px,(100vw - var(--wrap)) / 2) + var(--gutter)));border-radius:0}
  .lp-in{grid-template-columns:minmax(0,1fr)}
  .lp-side{position:static}
  .lp-side img{max-width:560px}
  .wb-a,.wb-b{grid-column:span 12}
  .ss-grid{grid-template-columns:minmax(0,1fr)}
  .ss-photo{min-height:340px}
}
@media (max-width:760px){
  .hb-grid{grid-template-columns:minmax(0,1fr);grid-template-areas:"hero" "sketch" "photo" "cloud" "search" "lic"}
  .hb-photo{min-height:240px}
  .sk-low{grid-template-columns:minmax(0,1fr)}
  .pj-proj{display:flex}
  .pj-proj > img{height:200px;min-height:0}
  .pj-led{grid-template-columns:minmax(0,1fr)}
  .pj-led > img{height:180px}
  .pj-route{width:110px}
  .dc-grid{grid-template-columns:minmax(0,1fr)}
  .lp-step{grid-template-columns:minmax(0,1fr);gap:12px;min-height:0}
  .lp-step:nth-child(even),.lp-step:nth-child(odd){margin-left:0;margin-right:0}
  .ss-table th,.ss-table td{padding:14px 6px}
  .ss-table td b{font-size:15px}
  .ss-table .ss-save td b{font-size:16px}
  .ss-table tbody th{font-size:12px;letter-spacing:.04em}
  .ss-table thead th:first-child,.ss-table tbody th{width:28%}
  .fq-head{flex-direction:column;align-items:flex-start}
  .fq-photo{width:100%;max-width:360px}
  .fq-cols{grid-template-columns:minmax(0,1fr)}
  .fq-col:first-child .fq-item:last-child{border-bottom:0}
  .ib::before{background:linear-gradient(0deg,rgba(14,26,58,.9) 0%,rgba(14,26,58,.72) 100%)}
}
@media (max-width:420px){
  .sk-board{gap:6px;padding:10px}
  .sk-col{padding:8px 6px}
  .sk-lab{letter-spacing:.02em}
  .sk-card{padding:8px 8px 20px}
  .hb-cta .hm-btn{flex:1 1 100%}
  .wb-parts li{grid-template-columns:48px minmax(0,1fr) auto;gap:10px}
  .wb-th{width:48px;height:48px}
  .wb-buy .hm-btn{width:100%}
}
@media (min-width:1101px){
  .wb-c{display:grid;grid-template-columns:1.1fr 1.4fr .9fr;align-items:center;gap:clamp(20px,3vw,48px)}
  .wb-c .wb-buy{margin-top:0;flex-direction:column;align-items:flex-start}
}
@media (prefers-reduced-motion:reduce){
  .hb-blob,.ms-track,.sk-card.is-live,.sk-path .nd.on{animation:none}
  .hm .tile:hover{translate:none}
  /* no motion: the strip becomes a row you scroll yourself, one copy of the list */
  .ms-row{overflow-x:auto;-webkit-mask-image:none;mask-image:none;scrollbar-width:thin;padding-bottom:6px}
  .ms-set[aria-hidden="true"],.ms-pause{display:none}
}
.ms-row:focus-visible{outline:2px solid var(--lime);outline-offset:2px}
