/* GWIND homepage typography, palette and product-card surfaces. */
@font-face{font-family:StudioManrope;src:url('../catch-lab-ice-hero-v15/media/ManropeVariable.ttf') format('truetype');font-weight:200 800;font-display:swap}
:root{--ink:#151c19;--paper:#f4f6f5;--accent:#ffc200;--muted:#68716c}
html{scroll-behavior:smooth}
body{background:var(--paper);color:var(--ink);font-family:StudioManrope,'PingFang SC',sans-serif}
.nav{height:80px;padding:0 4.5vw;background:#101613;border:0;color:#fff}
.wordmark{width:154px;letter-spacing:0}
.wordmark img{width:154px;height:auto}
.home-link{font-size:12px;font-weight:600;gap:28px}
.home-link span{font-size:23px;transition:transform .25s}
.home-link:hover span{transform:translate(3px,-3px)}
.workspace{grid-template-columns:minmax(420px,46%) minmax(0,1fr);gap:0;max-width:1800px;margin:auto}
.configuration{padding:54px clamp(24px,4.5vw,72px) 36px;border:0;min-width:0}
.configuration header .micro{color:#68716c;font-size:10px;letter-spacing:.14em}
.configuration h1{font:900 italic clamp(42px,4.6vw,82px)/.94 Barlow,sans-serif;letter-spacing:-.025em;margin:26px 0 24px}
.configuration h1 span{color:#eab400}
.configuration header p{font-size:14px;color:#606963;margin:0;line-height:1.8}
.single-shortcut{display:flex;align-items:center;justify-content:space-between;width:fit-content;min-width:240px;gap:36px;background:#ffc200;color:#151c19;border:0;margin:28px 0 42px;padding:16px 22px;font-size:13px;font-weight:700;transition:box-shadow .25s,transform .25s}
.single-shortcut span{font-size:24px;line-height:1}
.single-shortcut:hover{background:#ffc200;color:#151c19;box-shadow:0 9px 24px #151c1920;transform:translateY(-2px)}
#form>fieldset{background:#fff;border:0;border-radius:18px;margin:20px -20px 0;padding:28px 22px;box-shadow:0 2px 5px #151c1903,0 15px 40px #151c1904}
#form>fieldset>legend{display:flex;align-items:center;gap:14px;float:left;font-size:21px;font-weight:800;letter-spacing:-.04em;margin:0 0 28px;padding:0}
#form>fieldset>legend span{display:grid;place-items:center;width:30px;height:30px;border-radius:50%;background:#151c19;color:#fff;font-size:10px;letter-spacing:0;margin:0;flex-shrink:0}
.fields{gap:26px 18px}
.field{font-size:13px;color:#242c27;gap:10px}
.field>span{font-weight:650}
.live-tag{display:none}
.field input,.field select,.field textarea,.single-adjust select{background:#f5f6f5;border:1px solid #e1e5e2;color:#151c19;border-radius:8px;padding:12px 14px;min-height:48px;font-size:13px;transition:border-color .2s,box-shadow .2s}
.field input:hover,.field select:hover,.field textarea:hover{border-color:#adb7b0}
.field input:focus,.field select:focus,.field textarea:focus{border-color:#151c19;box-shadow:0 0 0 3px #ffc20030;outline:0}
.field input[type=range],.single-length input{accent-color:#e8b200;box-shadow:none}
.field small,.hint,.hint.wide{color:#747c77;font-size:11px!important;line-height:1.8}
.option-grid{gap:8px}
.option>span{min-height:46px;background:#f4f6f4;color:#535e57;border:1px solid transparent;border-radius:8px;font-size:12px;font-weight:600;padding:11px 14px;transition:background .2s,color .2s,box-shadow .2s}
.option:hover>span{border-color:#dde3de;background:#e9eeea}
.option input:checked+span{background:#151c19;color:#fff;border-color:#151c19;box-shadow:none}
.option input:focus-visible+span{outline:2px solid #c69a00;outline-offset:3px}
.color-option>span{font-size:11px}.color-option i{border-color:#151c1920}
.reference-option input:checked+span{box-shadow:none}
.reference-option.shaft:has(input[value=none])>span:before{background:#e7ebe7;color:#151c19;border-radius:5px}
.reference-thumb{border-radius:4px}
.upload-zone{background:#f5f7f5;border:1px dashed #bfc9c2;border-radius:10px;color:#151c19;font-weight:600}
.upload-zone span,.upload-zone small{color:#69746b}
.logo-row{margin-top:12px}.logo-row button{color:#56635b;border-color:#d2dbd5;font-size:12px}.logo-row img{background:#e8ece9;border-radius:6px}
.single-panel{background:#f6f8f6;border:0;border-radius:12px;padding:22px}
.single-heading strong{font-size:20px;letter-spacing:-.04em}
.single-heading .hint{font-size:12px!important}
.single-upload{border:1px dashed #aebcb3;background:#fff;border-radius:10px;min-height:94px;color:#151c19;transition:box-shadow .2s}
.single-upload:hover{box-shadow:0 5px 16px #151c1910}
.single-upload:focus-within{outline-color:#c69a00}
.single-uploaded img{border-radius:5px}
.single-panel fieldset{border:0}
.single-panel legend{font-size:12px;color:#151c19;font-weight:650}
.single-modes .option>span{background:#fff;font-size:13px}
.single-modes input:checked+span{background:#151c19;color:#fff}
.single-modes input:checked+span small{color:#b7c0ba}
.single-length output{font-weight:800;color:#151c19}
#single-example{background:#fff;border:1px solid #e2e8e3;border-radius:10px;padding:15px;transition:box-shadow .2s,transform .2s}
#single-example strong{font-size:13px;color:#151c19}#single-example small{color:#727c75}.single-example-arrow{color:#151c19}
#single-example:hover{background:#fff;border-color:#e2e8e3;box-shadow:0 6px 20px #151c1912;transform:translateY(-2px)}
.single-adjust{border-color:#e0e5e1}.single-adjust summary{font-size:13px;font-weight:600}
.single-spec{border-color:#e0e5e1;color:#535e57}.single-spec small{color:#7b837d}
.single-download{color:#65756b}#single-message{color:#4e6957}
.viewer{position:sticky;top:20px;height:calc(100svh - 120px);min-height:530px;margin:20px 24px 20px 0;border-radius:22px;background:radial-gradient(ellipse at 65% 20%,#fff 0,#f6f8f7 60%,#e7ede9 100%);box-shadow:0 1px 2px #151c1908,0 16px 50px #17281e0b;border:1px solid #fff;isolation:isolate}
.viewer-head{top:27px;left:30px;right:30px;color:#737c76}.viewer-head .micro{font-size:9px;letter-spacing:.11em}
.preview-detail{top:56px;left:30px;right:30px;font-size:11px;color:#859087;line-height:1.7}
#canvas{inset:92px 0 152px;z-index:1}
.viewer-bottom{left:30px;right:30px;bottom:22px;z-index:2}
.view-buttons{gap:6px;justify-content:center}
.view-buttons button{background:#fff;color:#59675e;border:0;border-radius:30px;padding:10px 15px;font-size:11px;font-weight:600;box-shadow:0 2px 8px #151c1905;transition:background .2s,box-shadow .2s,transform .2s}
.view-buttons button[aria-pressed=true]{background:#ffc200;color:#151c19}
.view-buttons button:hover{transform:translateY(-2px);box-shadow:0 5px 12px #151c1912}
.viewer-bottom p{color:#7d887f;font-size:10px;line-height:1.7;text-align:center;margin:12px 0 0}
.viewer-bottom #render-status{margin:6px 0 0;color:#506957}
.brief{background:#101613;color:#fff;border:0;border-radius:18px;padding:28px 22px;margin:28px -20px 0}
.brief .micro{color:#a8b3ad}.brief h3{font-size:24px;font-weight:750;margin:10px 0 20px}.brief p{color:#b7c0ba;font-size:12px;line-height:1.9}.brief .field{color:#fff}.brief .field input{background:#1c241f;color:#fff;border-color:#344239}
.btn,.actions .btn{background:#ffc200;color:#151c19;border:0;padding:13px 18px;font-size:12px;font-weight:700;transition:transform .2s,box-shadow .2s}
.btn:hover{transform:translateY(-2px);box-shadow:0 6px 15px #0002}.btn.outline{background:#27322c;color:#fff}
#status{background:#f4f6f5;color:#46604e;font-size:12px;padding:14px 0;z-index:2}
input:invalid{border-color:#c97161}
@media(min-width:1700px){.configuration h1{font-size:82px}}
@media(max-width:1000px) and (min-width:761px){.workspace{grid-template-columns:minmax(360px,48%) 1fr}.configuration{padding-left:35px;padding-right:35px}.configuration h1{font-size:42px}.viewer-head{left:22px;right:22px}.viewer-head span:last-child{display:none}.viewer-bottom{left:15px;right:15px}#canvas{inset:92px 0 182px}}
@media(max-width:760px){.nav{height:64px;padding:0 22px}.wordmark,.wordmark img{width:125px}.home-link{gap:12px}.workspace{display:flex}.viewer{top:0;width:100%;height:36svh;min-height:290px;margin:0;border:0;border-radius:0 0 20px 20px;z-index:10;box-shadow:0 12px 30px #151c190d}.viewer-head{top:15px;left:22px;right:22px}.viewer-head .micro{font-size:8px}.preview-detail{left:22px;top:37px;font-size:9px}.viewer-bottom{left:15px;right:15px;bottom:10px}.view-buttons{gap:4px}.view-buttons button{font-size:10px;padding:6px 10px;min-height:38px}.viewer-bottom p{display:none}#canvas{inset:58px 0 68px}.configuration{padding:32px 28px}.configuration h1{font-size:clamp(40px,10.5vw,62px);margin:21px 0}.configuration header p{font-size:13px}.single-shortcut{margin:22px 0 30px;min-width:230px}.fields{gap:22px 14px}#form>fieldset{padding:24px 18px;margin:16px -10px 0;scroll-margin-top:calc(36svh + 25px)}#form>fieldset>legend{font-size:20px}.option>span{font-size:11px;padding:10px 12px}.single-panel{padding:16px}.single-panel .single-modes .option>span{padding:11px}.viewer:has([data-view=design]:not([hidden])){height:36svh;min-height:290px}.viewer:has([data-view=design]:not([hidden])) #canvas{inset:58px 0 100px}.viewer:has([data-view=design]:not([hidden])) .view-buttons{display:flex;flex-wrap:wrap}.brief{margin:22px -10px 0}#label-graphic,.single-panel{scroll-margin-top:calc(36svh + 26px)}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{transition:none!important}}
