@font-face{font-family:'Logokat Inter';font-style:normal;font-weight:400;font-display:swap;src:url('./fonts/inter-cyrillic-400-normal.woff2') format('woff2');unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:'Logokat Inter';font-style:normal;font-weight:400;font-display:swap;src:url('./fonts/inter-latin-400-normal.woff2') format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF,U+FEFF,U+FFFD}
@font-face{font-family:'Logokat Inter';font-style:normal;font-weight:500;font-display:swap;src:url('./fonts/inter-cyrillic-500-normal.woff2') format('woff2');unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:'Logokat Inter';font-style:normal;font-weight:500;font-display:swap;src:url('./fonts/inter-latin-500-normal.woff2') format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF,U+FEFF,U+FFFD}
@font-face{font-family:'Logokat Inter';font-style:normal;font-weight:600;font-display:swap;src:url('./fonts/inter-cyrillic-600-normal.woff2') format('woff2');unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:'Logokat Inter';font-style:normal;font-weight:600;font-display:swap;src:url('./fonts/inter-latin-600-normal.woff2') format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF,U+FEFF,U+FFFD}
@font-face{font-family:'Logokat Inter';font-style:normal;font-weight:700;font-display:swap;src:url('./fonts/inter-cyrillic-700-normal.woff2') format('woff2');unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:'Logokat Inter';font-style:normal;font-weight:700;font-display:swap;src:url('./fonts/inter-latin-700-normal.woff2') format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF,U+FEFF,U+FFFD}
@font-face{font-family:'Logokat Inter';font-style:normal;font-weight:800;font-display:swap;src:url('./fonts/inter-cyrillic-800-normal.woff2') format('woff2');unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:'Logokat Inter';font-style:normal;font-weight:800;font-display:swap;src:url('./fonts/inter-latin-800-normal.woff2') format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF,U+FEFF,U+FFFD}
@font-face{font-family:'Logokat Inter';font-style:normal;font-weight:900;font-display:swap;src:url('./fonts/inter-cyrillic-900-normal.woff2') format('woff2');unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:'Logokat Inter';font-style:normal;font-weight:900;font-display:swap;src:url('./fonts/inter-latin-900-normal.woff2') format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF,U+FEFF,U+FFFD}
:root{--bg:#f5f5f7;--ink:#181c18;--muted:#797c73;--dark:#111113;--accent:#0071e3;--line:rgba(30,35,29,.18);--kraft:#c9a476;--headline:'Logokat Inter',sans-serif}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;font-family:'Logokat Inter',sans-serif;color:var(--ink);background:var(--bg);-webkit-font-smoothing:antialiased}body:has(dialog[open]){overflow:hidden}a{color:inherit;text-decoration:none}button,input{font:inherit}button{cursor:pointer}button:focus-visible,a:focus-visible,input:focus-visible,summary:focus-visible{outline:2px solid var(--accent);outline-offset:4px}::selection{background:#cce4ff;color:#1d1d1f}  .scroll-progress{position:fixed;top:0;left:0;height:3px;background:var(--accent);width:0;z-index:100;transition:width .08s linear}.section-pad{padding:92px 6.5%} .site-header{height:84px;position:absolute;z-index:50;top:0;left:0;width:100%;display:flex;align-items:center;justify-content:space-between;padding:0 6.5%;color:#f7f4eb;border-bottom:1px solid rgba(255,255,255,.13)}.brand{font-size:29px;letter-spacing:-2.5px;font-weight:950;line-height:1}.brand span{color:var(--accent)}.brand i{color:var(--accent);font-style:normal;font-size:11px;vertical-align:top;margin-left:3px}.desktop-nav,.header-actions{display:flex;align-items:center;gap:37px}.desktop-nav a{font-size:12px;font-weight:700;letter-spacing:.03em;color:#c3c6bd;transition:color .25s}.desktop-nav a:hover{color:#fff}.btn{border:0;display:inline-flex;align-items:center;justify-content:space-between;gap:30px;padding:18px 22px;font-size:12px;font-weight:800;white-space:nowrap;letter-spacing:.015em;transition:transform .2s,background .2s,color .2s;border-radius:3px}.btn:hover{transform:translateY(-3px)}.btn span{font-size:18px;font-weight:400}.btn-header{background:#f5f5f7;color:#151713;padding:13px 16px}.btn-accent{background:var(--accent);color:#fff}.btn-accent:hover{background:#0067ce}.btn-dark{background:#171a17;color:#f9f8f2}.text-link{display:inline-flex;align-items:center;gap:20px;color:#ecece4;font-size:12px;font-weight:800;border-bottom:1px solid rgba(255,255,255,.45);padding:15px 0}.text-link span{font-size:18px}.menu-toggle,.mobile-menu{display:none}.hero{min-height:770px;height:min(900px,100svh);position:relative;background:#111113;color:#f7f7f0;overflow:hidden;display:flex;align-items:center}.hero-copy{position:relative;z-index:5;width:52%;margin-top:12px}.eyebrow{font-size:10px;font-weight:850;letter-spacing:.22em;color:#b9bdb4;display:flex;align-items:center;gap:10px}.eyebrow.dark{color:#737971}.red-dot{width:7px;height:7px;background:var(--accent);border-radius:50%;display:inline-block}.hero h1,.display-heading,.final-cta h2{font-family:var(--headline);font-weight:900;letter-spacing:-.037em;font-stretch:condensed}.hero h1{font-size:clamp(64px,8.35vw,150px);line-height:.86;margin:33px 0 31px;white-space:nowrap}.hero h1 em,.display-heading em,.final-cta h2 em,.request-form h3 em{font-style:normal;color:var(--accent)}.hero-lead{font-size:16px;line-height:1.65;max-width:420px;color:#bbc1b8}.hero-ctas{display:flex;align-items:center;gap:30px;margin-top:35px}.hero-visual{position:absolute;inset:8% 0 8% 43%;z-index:2;display:flex;align-items:center;justify-content:center}.product-canvas{display:block;width:100%;height:100%;position:absolute;inset:0;touch-action:pan-y;cursor:grab;z-index:3}.product-canvas:active{cursor:grabbing}.product-canvas:focus-visible{outline:2px solid var(--accent);outline-offset:-4px}.orbit-hint{position:absolute;bottom:12%;right:9%;font-size:9px;letter-spacing:.18em;color:#89968a}.canvas-fallback{position:absolute;inset:0;display:none;place-items:center;transform:rotate(28deg)}.fallback-handle{width:40px;height:240px;border-radius:15px;background:linear-gradient(90deg,#050605,#393d3b 42%,#0b0c0c 83%);box-shadow:16px 12px 40px #0008}.fallback-head{width:110px;height:60px;background:linear-gradient(135deg,#171817,#4b4c47,#111);border-radius:22px;position:absolute;top:calc(50% + 100px);transform:rotate(90deg)}.hero-bottom{position:absolute;bottom:38px;left:6.5%;right:6.5%;display:flex;gap:25px;align-items:center;font-size:9px;font-weight:750;letter-spacing:.16em;color:#a8b0a4;z-index:5}.scroll-cue{margin-left:auto;color:#eee;display:flex;align-items:center;gap:20px}.scroll-cue span{font-size:20px}.section-index{display:flex;gap:16px;align-items:center;font-size:10px;letter-spacing:.18em;font-weight:800;color:#6f736b;margin-bottom:64px}.section-index.light{color:#a5aa9f}.display-heading{font-size:clamp(46px,6.4vw,104px);line-height:.99;margin:0}.display-heading .muted{color:#adafa5}.manifesto{background:#f5f5f7;min-height:565px}.manifesto-grid{display:grid;grid-template-columns:1fr 3fr;align-items:start;gap:30px}.engineering{background:#171719;color:#eff0e8;min-height:785px}.engineering .section-index{margin-bottom:25px}.engineering-grid{display:grid;grid-template-columns:47% 53%;min-height:585px}.engineering-copy{padding-top:35px;z-index:4}.pill{border:1px solid #586156;color:#a3afa1;display:inline-flex;gap:25px;padding:11px 12px;font-size:9px;letter-spacing:.14em;font-weight:800;margin-bottom:29px}.pill span{color:var(--accent)}.engineering-copy .display-heading{font-size:clamp(52px,6vw,95px)}.engineering-copy>p{max-width:400px;font-size:15px;line-height:1.7;color:#a8ada4;margin:24px 0}.mode-switch{display:inline-flex;border:1px solid #4c554a;padding:4px;margin-top:24px}.mode{background:transparent;color:#aeb5a7;padding:13px 19px;border:0;font-size:12px;font-weight:750}.mode.active{background:#f5f5f7;color:#161916}.engineering-copy .mode-description{font-size:11px;color:#8f998d;margin-top:17px}.engineering-scene{position:relative;min-height:580px}.scene-label{position:absolute;z-index:5;display:flex;flex-direction:column;gap:7px;font-size:10px;line-height:1.35;color:#b9c1b5;transition:opacity .25s,transform .3s}.scene-label b{color:#fff;font-size:11px;letter-spacing:.13em}.label-head{top:62%;left:0}.label-body{top:14%;right:2%}.label-ink{bottom:17%;right:2%}.scene-label:before{content:'';width:60px;height:1px;background:var(--accent);position:absolute;right:calc(100% + 15px);top:8px}.label-head:before{left:0;top:-15px}.scene-caption{position:absolute;bottom:0;left:50%;transform:translateX(-50%);white-space:nowrap;font-size:9px;letter-spacing:.15em;color:#7c8979}.how{background:#f5f5f7;padding-bottom:120px}.how-head,.builder-title,.trans-head{display:flex;justify-content:space-between;align-items:end;gap:35px;margin-bottom:48px}.how-head>p,.builder-title>p,.trans-head>p{max-width:310px;line-height:1.7;color:#676d63;font-size:15px}.demo-workspace{border:1px solid #d2d1c9;background:#eae7df;padding:17px}.demo-top,.preview-top,.preview-footer,.panel-top{display:flex;justify-content:space-between;align-items:center;font-size:10px;font-weight:800;letter-spacing:.15em}.demo-top{padding:9px 9px 20px;color:#777e73}.live-indicator{display:flex;align-items:center;gap:8px}.live-indicator>span{width:6px;height:6px;border-radius:100%;background:var(--accent);box-shadow:0 0 0 4px #0071e321}.craft-board{height:clamp(320px,36vw,510px);overflow:hidden;position:relative;background:linear-gradient(145deg,#cba777,#c3a071 50%,#bc9869);border:1px solid #ad8d62;isolation:isolate}.craft-pattern{position:absolute;inset:0;opacity:.23;background-image:repeating-linear-gradient(0deg,transparent 0px,transparent 3px,#956b38 4px),url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='30' height='30'%3E%3Cpath d='M0 0L30 30M30 0L0 30' stroke='%23aa7e4c' opacity='.15'/%3E%3C/svg%3E")}.craft-board:after{content:'';position:absolute;left:9%;right:9%;top:50%;height:1px;box-shadow:0 1px 2px #79502b88;transform:rotate(-8deg);z-index:1}.print-path{--paint:#262924;position:absolute;top:50%;left:11%;width:78%;height:72px;transform:rotate(-8deg);overflow:hidden;z-index:2;clip-path:inset(0 100% 0 0)}.print-content{white-space:nowrap;display:flex;align-items:center;justify-content:center;height:100%;gap:25px;border-top:4px solid var(--paint);border-bottom:4px solid var(--paint);color:var(--paint);font-weight:950;font-size:clamp(16px,2.6vw,37px);letter-spacing:-.05em;font-family:var(--headline)}.print-path.printed{clip-path:inset(0 0 0 0)}@keyframes inkReveal{0%{clip-path:inset(0 100% 0 0)}100%{clip-path:inset(0 0 0 0)}}@keyframes rollerSlide{from{left:4%}to{left:82%}}.craft-detail{position:absolute;font-size:9px;letter-spacing:.18em;color:#745b3b}.d1{bottom:20px;left:24px}.d2{top:20px;right:25px}.demo-controls{display:flex;justify-content:space-between;align-items:center;padding:18px 7px 1px}.color-control{display:flex;align-items:center;gap:24px}.control-label{font-size:10px;font-weight:850;letter-spacing:.12em;color:#6d736a}.swatches{display:flex;align-items:center;gap:9px}.swatch{width:27px;height:27px;border-radius:50%;background:var(--swatch);border:3px solid #eae7df;box-shadow:0 0 0 1px transparent}.swatch.active{box-shadow:0 0 0 1px #1c201a}.swatch.light-swatch{border-color:#d0ccc3}.demo-disclaimer{font-size:11px;color:#868980;margin:13px 0 0;line-height:1.5}.features{background:#161618;color:#f5f4ec;min-height:810px}.feature-intro{margin-bottom:72px}.feature-intro .display-heading{font-size:clamp(60px,7.2vw,116px)}.feature-cards{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid #3b4339}.feature-card{min-height:290px;position:relative;padding:26px 30px 0 0;border-right:1px solid #394036}.feature-card+ .feature-card{padding-left:30px}.feature-card:last-child{border-right:0}.feature-card h3{font-size:24px;margin:9px 0 11px}.feature-card p{max-width:310px;font-size:13px;line-height:1.75;color:#a5ac9e}.builder{background:#f5f5f7}.builder-title .display-heading{font-size:clamp(54px,6vw,96px);margin-top:17px}.builder-shell{display:grid;grid-template-columns:1.13fr .87fr;min-height:680px;border:1px solid #cfcfc5;background:#ffffff}.builder-preview{padding:20px;background:#e7e4db;display:flex;flex-direction:column}.preview-top{padding:8px 7px 22px;color:#737b71}.preview-status{color:#6c8b67}.preview-board{background:#c9a575;flex:1;position:relative;min-height:470px;overflow:hidden;box-shadow:inset 0 0 70px rgba(115,68,26,.08);transition:background .2s}.preview-board[data-surface="white"]{background:#ece9df}.preview-board[data-surface="dark"]{background:#3c413c}.preview-board:before{content:'';position:absolute;inset:0;opacity:.22;background:repeating-linear-gradient(90deg,transparent,transparent 3px,#86714c 4px,transparent 6px)}.preview-crease{height:1px;background:#8f795b5c;position:absolute;left:-10%;right:-10%;transform:rotate(-10deg);z-index:1}.preview-crease.top{top:24%}.preview-crease.bottom{bottom:22%}.preview-band{--ink:#252923;position:absolute;left:-40%;width:180%;top:43%;transform:rotate(-11deg);height:115px;display:flex;align-items:center;border-top:4px solid var(--ink);border-bottom:4px solid var(--ink);overflow:hidden;color:var(--ink)}.preview-repeat{width:100%;display:flex;align-items:center;justify-content:center;gap:23px;white-space:nowrap;font-family:var(--headline);font-size:clamp(23px,3.6vw,59px);letter-spacing:-.03em;font-weight:900}.preview-repeat span{flex-shrink:0}.preview-repeat img{height:72px;max-width:150px;object-fit:contain;filter:grayscale(1)}.preview-board-caption{position:absolute;bottom:24px;left:25px;font-size:9px;color:#866a43;letter-spacing:.15em;font-weight:850}.preview-board[data-surface="dark"] .preview-board-caption{color:#a8b1a5}.preview-footer{color:#8e9489;padding:21px 6px 5px;font-size:9px}.inline-action{border:0;background:transparent;font-size:10px;font-weight:850;text-transform:uppercase;letter-spacing:.08em;padding:8px 0;border-bottom:1px solid #74796e}.builder-panel{padding:31px 38px 28px;display:flex;flex-direction:column}.panel-top{color:#80867c;padding-bottom:29px;border-bottom:1px solid #d2d2d7}.field-label{display:flex;justify-content:space-between;font-size:11px;font-weight:850;letter-spacing:.1em;margin:24px 0 13px;text-transform:uppercase}.field-label span{color:#a5a99f;font-weight:500}.brand-input{font-size:28px;padding:12px 0;border:0;border-bottom:2px solid #1c211b;outline:0;background:transparent;font-weight:900;letter-spacing:-.04em;color:#191d19;text-transform:uppercase;width:100%;border-radius:0}.brand-input:focus{border-bottom-color:var(--accent)}.builder-panel small{color:#969b93;font-size:10px;margin-top:10px;line-height:1.5}.file-input-label{border:1px dashed #b9c0b5;padding:12px 13px;font-size:11px;font-weight:750;margin-top:16px;cursor:pointer;display:block;color:#515154}.file-input-label span{font-size:18px;vertical-align:middle;margin-right:10px}.file-input-label input{position:absolute;width:1px;height:1px;opacity:0}.reset-logo{border:0;background:transparent;text-align:left;color:#0066cc;padding:11px 0;font-size:11px}.builder-colors{display:flex;flex-wrap:wrap;gap:6px}.builder-swatch{border:1px solid #d2d2d7;background:#fff;padding:10px;display:flex;align-items:center;gap:7px;font-size:10px;color:#737b72;border-radius:3px}.builder-swatch.active{border-color:#252c24;color:#1b231b}.builder-swatch span{width:15px;height:15px;background:var(--swatch);border:1px solid #d4d4d4;border-radius:50%}.surface-switch{display:flex;gap:6px}.surface-switch button{flex:1;background:#f5f5f7;border:1px solid #d2d2d7;padding:11px 5px;font-size:10px;color:#858b82}.surface-switch button.active{color:#161b15;border-color:#1c231a;background:#edf4ff}input[type=range]{accent-color:var(--accent);width:100%;cursor:pointer}.btn-full{width:100%;margin-top:28px}.builder-panel .micro-note{font-size:10px;line-height:1.6;color:#969b93;margin:12px 0 0}.transformation{background:#161618;color:#f4f5ec}.trans-head{margin-bottom:49px}.trans-head .display-heading{font-size:clamp(52px,6vw,93px)}.trans-head p{color:#a8b4a4}.compare{height:clamp(340px,43vw,580px);position:relative;overflow:hidden;isolation:isolate;background:radial-gradient(ellipse at 50% 45%,#353e32,#272c25 70%);touch-action:pan-y}.compare-base,.compare-before{position:absolute;inset:0}.compare-before{width:50%;overflow:hidden;background:#bdbbb2;z-index:2}.compare-base .package-face:after{content:'ROLLÉ  /  ROLLÉ  /  ROLLÉ  /  ROLLÉ';position:absolute;top:34%;left:-14%;width:140%;height:55px;display:flex;align-items:center;background:#292c25;color:#e0d9c7;font-family:var(--headline);font-size:clamp(16px,2.5vw,36px);letter-spacing:.04em;white-space:nowrap;transform:rotate(-12deg)}.compare-base .package-face:before{content:'ROLLÉ  /  ROLLÉ  /  ROLLÉ';position:absolute;top:64%;left:-5%;width:130%;height:36px;color:#2c302a;font-family:var(--headline);font-size:clamp(17px,2.3vw,34px);letter-spacing:.05em;white-space:nowrap;transform:rotate(-12deg);z-index:1}.package-scene{width:min(51%,580px);aspect-ratio:1.25;position:absolute;top:12%;left:27%;transform:skewY(-3deg) rotate(-3deg);filter:drop-shadow(30px 55px 30px #0a0e0b66)}.package-face{position:absolute;inset:20% 11% 0 0;background:linear-gradient(145deg,#d6b489,#bd9666);overflow:hidden;box-shadow:inset -20px -15px 20px #9e764945}.package-top{position:absolute;left:0;top:0;width:89%;height:21%;background:linear-gradient(160deg,#edd1a7,#d3ae7e);clip-path:polygon(14% 0,100% 10%,100% 100%,0 100%)}.package-side{position:absolute;right:0;bottom:0;height:80%;width:12%;background:#a78151;clip-path:polygon(0 0,100% 8%,100% 95%,0 100%)}.package-noise{position:absolute;inset:0;opacity:.18;background:repeating-linear-gradient(45deg,transparent,transparent 2px,#6d4b2d 3px);z-index:1;pointer-events:none}.compare-before .package-scene{width:min(102%,580px);left:54%}.comparison-label{position:absolute;bottom:25px;font-size:10px;font-weight:850;letter-spacing:.14em;z-index:5;padding:13px 15px}.comparison-label.after{right:24px;background:#f0e5d5;color:#1f231e}.comparison-label.before{left:24px;background:#1b1d1a;color:#f5f3eb}.compare-divider{position:absolute;top:0;bottom:0;left:50%;width:2px;background:#fcf9f2;z-index:4;pointer-events:none}.compare-divider span{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);display:grid;place-items:center;background:#f6f4ea;border-radius:50%;width:50px;height:50px;color:#222720;box-shadow:0 5px 22px #0005;font-size:20px}.compare input[type=range]{position:absolute;inset:0;width:100%;height:100%;margin:0;opacity:0;cursor:ew-resize;z-index:6}.faq{background:#f5f5f7}.faq-grid{display:grid;grid-template-columns:45% 55%;gap:30px}.faq-list{border-top:1px solid #d2d2d7}.faq details{border-bottom:1px solid #d2d2d7;padding:21px 0}.faq summary{list-style:none;display:flex;justify-content:space-between;align-items:center;cursor:pointer;font-weight:780;font-size:15px}.faq summary::-webkit-details-marker{display:none}.faq summary span{font-size:25px;font-weight:400}.faq details[open] summary span{transform:rotate(45deg)}.faq details p{font-size:13px;line-height:1.8;color:#686f64;max-width:500px}.final-cta{background:#1a211b;min-height:620px;color:#f6f4ec;position:relative;overflow:hidden;display:flex;align-items:center}.final-cta h2{font-size:clamp(74px,10.5vw,166px);line-height:.91;margin:35px 0}.site-footer{padding:35px 6.5%;background:#101310;color:#d7ded0;display:flex;align-items:center;justify-content:space-between;gap:20px}.site-footer>span,.site-footer>a:last-child{font-size:10px;font-weight:750;letter-spacing:.13em}.request-dialog{width:min(510px,calc(100vw - 30px));max-height:90vh;border:0;padding:0;background:#f5f5f7;color:#1b2119;box-shadow:0 30px 120px #0008}.request-dialog::backdrop{background:#070a08b8;backdrop-filter:blur(7px)}.request-form{padding:34px 35px;position:relative;display:flex;flex-direction:column}.request-form h3{font-family:var(--headline);font-size:56px;line-height:.94;margin:25px 0 15px;text-transform:uppercase;letter-spacing:-.035em}.request-form p{font-size:12px;line-height:1.7;color:#737b70}.request-summary{background:#f5f5f7;padding:17px;font-size:12px;line-height:2;margin:17px 0}.request-form label{font-size:11px;font-weight:850;display:flex;flex-direction:column;gap:8px;margin:10px 0}.request-form label input{border:1px solid #cccfc4;background:#fff;padding:12px;outline:0}.request-form>small{font-size:10px;color:#81877d;text-align:center;margin-top:12px}.close-dialog{position:absolute;right:20px;top:13px;border:0;background:transparent;font-size:31px}.reveal{opacity:0;transform:translateY(23px);animation:reveal 1s forwards}.reveal:nth-of-type(2){animation-delay:.12s}.reveal:nth-of-type(3){animation-delay:.25s}.reveal:nth-of-type(4){animation-delay:.37s}@keyframes reveal{to{opacity:1;transform:translateY(0)}}
@media(max-width:1180px){.desktop-nav{gap:19px}.hero h1{font-size:8vw}.hero-copy{width:58%}.engineering-copy .display-heading{font-size:6.3vw}}
@media(max-width:800px){.section-pad{padding:65px 5%}.site-header{height:68px;padding:0 5%}.desktop-nav,.header-actions{display:none}.menu-toggle{display:block;color:white;background:none;border:0;font-size:24px}.mobile-menu{display:none;position:absolute;z-index:49;top:68px;left:0;right:0;padding:25px 5%;background:#141814;color:white;flex-direction:column;gap:20px}.mobile-menu.open{display:flex}.mobile-menu a{font-size:15px;padding:8px}.hero{height:auto;min-height:875px;padding-top:105px;padding-bottom:60px;align-items:start}.hero-copy{width:100%}.hero h1{font-size:clamp(61px,13vw,110px);margin:28px 0 16px}.hero-lead{font-size:14px;max-width:410px}.hero-ctas{gap:23px;margin-top:23px}.hero-bottom{left:5%;right:5%;bottom:20px;gap:14px;font-size:8px}.orbit-hint{bottom:12%;right:6%}.section-index{margin-bottom:37px}.manifesto{min-height:520px}.manifesto-grid{grid-template-columns:1fr;gap:10px}.display-heading{font-size:clamp(48px,8vw,74px)}.engineering-grid{grid-template-columns:1fr}.engineering-copy{padding-top:10px}.engineering-copy .display-heading{font-size:clamp(54px,9vw,80px)}.engineering-scene{min-height:480px}.engineering .section-index{margin-bottom:12px}.scene-caption{bottom:0}.how-head,.builder-title,.trans-head{align-items:start;flex-direction:column;gap:12px}.how-head>p,.builder-title>p,.trans-head>p{max-width:560px;font-size:14px}.craft-board{height:380px}.demo-controls{gap:20px}.feature-intro .display-heading{font-size:clamp(55px,9vw,90px)}.feature-cards{grid-template-columns:1fr}.feature-card,.feature-card+.feature-card{padding:20px 0 18px;border-right:0;border-bottom:1px solid #3d443a;min-height:250px}.builder-shell{grid-template-columns:1fr}.preview-board{min-height:430px}.builder-panel{padding:28px}.faq-grid{grid-template-columns:1fr}.final-cta{min-height:520px}.final-cta h2{font-size:clamp(60px,11vw,100px)}}
@media(max-width:520px){.hero{min-height:790px}.hero h1{font-size:13.5vw}.hero-lead{font-size:13px}.hero-ctas{align-items:start;flex-direction:column;gap:4px}.hero-bottom span:first-child{max-width:150px;line-height:1.5}.hero-bottom .scroll-cue{font-size:8px}.manifesto .display-heading{font-size:12vw}.engineering-scene{min-height:390px}.scene-label{font-size:8px}.scene-label b{font-size:9px}.label-head{bottom:20%;top:auto}.label-body{top:11%}.label-ink{bottom:12%}.how .display-heading,.builder .display-heading,.trans-head .display-heading{font-size:12vw}.craft-board{height:310px}.demo-controls{flex-direction:column;align-items:stretch}.color-control{justify-content:space-between}.print-path{height:48px}.print-content{font-size:17px;border-width:2px}.preview-board{min-height:350px}.preview-repeat{font-size:28px}.preview-band{height:77px}.preview-repeat img{height:44px}.builder-preview{padding:12px}.builder-panel{padding:22px}.builder-swatch{font-size:0;padding:9px 12px}.builder-swatch span{width:19px;height:19px}.surface-switch button{font-size:9px}.package-scene{width:78%;left:15%;top:23%}.compare-before .package-scene{width:156%;left:30%;top:23%}.compare{height:300px}.comparison-label{font-size:8px;padding:9px}.final-cta h2{font-size:12vw}.site-footer>span{display:none}.request-form{padding:25px}.request-form h3{font-size:45px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{animation-duration:.001ms!important;transition-duration:.001ms!important}.reveal{opacity:1;transform:none}}
.compare-before{width:100%;clip-path:inset(0 50% 0 0);background:radial-gradient(ellipse at 50% 45%,#4a4c43,#30332e 70%)}.compare-before .package-scene{width:min(51%,580px);left:27%}

@media(max-width:800px){
  .hero{flex-direction:column}
  .hero-visual{
    position:relative;
    inset:auto;
    width:100%;
    height:clamp(300px,82vw,460px);
    flex:none;
    margin-top:16px;
  }
  .hero-visual .orbit-hint{bottom:0;right:0}
}

/* Shared typography and rhythm for the product presentation. */
:root{
  --headline:'Logokat Inter',sans-serif;
  --paper:#f5f5f7;
  --graphite:#181b18;
  --paper-accent:#0066cc;
  --content-gutter:max(5%,calc((100% - 1320px) / 2));
}
.section-pad{padding:clamp(72px,9vw,136px) var(--content-gutter)}
.site-header,.site-footer{padding-inline:var(--content-gutter)}
.site-header{height:74px}

.hero{padding-top:112px;padding-bottom:84px}
.hero h1,.display-heading,.final-cta h2{font-weight:800;letter-spacing:-.065em;font-stretch:normal}
.hero h1{font-size:clamp(68px,8vw,128px);line-height:.9}
.hero-lead{max-width:380px;color:#c1c6be}



.hero-bottom{left:var(--content-gutter);right:var(--content-gutter)}
.btn{border-radius:8px;min-height:44px}
.section-index{margin-bottom:clamp(24px,4vw,54px);font-size:11px;letter-spacing:.12em}
.display-heading,
.engineering-copy .display-heading,
.feature-intro .display-heading,
.builder-title .display-heading,
.trans-head .display-heading{
  font-size:clamp(38px,5.7vw,83px);
  line-height:.98;
  margin:0;
}
.manifesto .display-heading em{color:var(--paper-accent)}
.manifesto,.engineering,.features{min-height:0}
.manifesto,.how,.faq{background:var(--paper)}
.manifesto-grid,.faq-grid{grid-template-columns:minmax(0,1.55fr) minmax(0,1fr);gap:clamp(28px,5vw,74px)}
.manifesto-grid{align-items:end}
.manifesto-copy{padding:0 0 4px clamp(20px,3vw,44px);border-left:1px solid var(--line)}
.manifesto-copy p{margin:0 0 18px;color:#515154;line-height:1.65;max-width:360px}
.section-link{display:inline-flex;gap:14px;align-items:center;min-height:44px;font-weight:750;font-size:14px}
.section-link span{color:var(--paper-accent)}
.engineering,.transformation{background:var(--graphite)}
.engineering-grid{grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);gap:clamp(20px,4vw,64px);align-items:center;min-height:0}
.engineering-copy{padding:0}
.engineering-copy .mode-description{color:#c5c5ca;min-height:3.4em}
.engineering-scene{
  min-height:clamp(420px,45vw,570px);
  background:radial-gradient(ellipse at 54% 46%,#343436,#212123 64%,#1c1c1e);
  border:1px solid #424245;
  border-radius:16px;
  overflow:hidden;
}
.scene-label,.scene-caption{pointer-events:none}
.scene-label:before{width:clamp(10px,3vw,40px)}
.scene-caption{bottom:16px;left:16px;transform:none}
.label-head{left:16px}
.mode{min-height:44px}
.how-head,.builder-title,.trans-head{margin-bottom:clamp(24px,4vw,50px)}
.how-head>p,.builder-title>p,.trans-head>p{margin:0;max-width:36ch;color:#515154}
.trans-head>p{color:#c5c5ca}
.demo-workspace,.builder-shell,.compare{border-radius:16px;overflow:hidden}
.demo-workspace{background:#ffffff}
.craft-board,.preview-board{border-radius:8px}
.demo-disclaimer,.builder-panel .micro-note,.builder-panel small{color:#6e6e73}
.features{background:#f5f5f7;color:var(--ink)}
.features .section-index{color:#555c51}

.feature-intro{margin-bottom:clamp(28px,4vw,56px)}
.feature-cards{gap:16px;border:0}
.feature-card,.feature-card + .feature-card{
  min-height:0;
  padding:clamp(20px,3vw,34px);
  background:#ffffff;
  border:1px solid #d5d7ce;
  border-radius:12px;
}


.feature-card h3{font-size:21px;margin:0 0 8px}
.feature-card p{margin:0;color:#515154;font-size:14px;line-height:1.55}
.builder{background:#ffffff}
.builder-shell{background:#ffffff}
.builder-preview{background:#ececf0;min-width:0}
.preview-board{isolation:isolate}
.preview-top,.preview-footer,.panel-top{gap:12px;color:#515154;letter-spacing:.09em}
.preview-status{color:#515154}
.preview-footer .inline-action{white-space:nowrap}
.file-input-label:focus-within{outline:2px solid var(--paper-accent);outline-offset:3px}
.builder-swatch,.surface-switch button{min-height:44px;color:#515154}
.builder-swatch.active,.surface-switch button.active{border-color:var(--accent)}
.compare{border:1px solid #424245}
.compare-before .package-scene{width:min(51%,580px);left:27%}
.compare:focus-within .compare-divider span{outline:3px solid var(--accent);outline-offset:4px}
.faq summary{min-height:44px;gap:16px}
.faq details{padding:12px 0}
.faq summary span{flex:none}
.final-cta{min-height:0;background:var(--graphite);padding-bottom:clamp(125px,12vw,170px)}
.final-cta h2{font-size:clamp(42px,7.4vw,110px);line-height:.96;margin:24px 0 32px}

.site-footer{border-top:1px solid #363e34}

@media(max-width:800px){
  .site-header{height:68px}
  .hero{padding-top:105px;padding-bottom:64px}
  .hero h1{font-size:clamp(58px,11vw,88px)}
  .manifesto-grid,.engineering-grid,.faq-grid{grid-template-columns:minmax(0,1fr);gap:24px}
  .manifesto-copy{border-left:0;border-top:1px solid var(--line);padding:18px 0 0}
  .engineering-scene{min-height:clamp(350px,75vw,480px)}
  .feature-card,.feature-card + .feature-card{display:grid;grid-template-columns:48px minmax(0,1fr);column-gap:18px;align-items:start}
  
  
  .feature-card h3{margin:8px 0}
  .preview-footer{flex-wrap:wrap}
}
@media(max-width:520px){
  .hero h1{font-size:clamp(48px,14vw,70px);white-space:normal}
  .hero-ctas{gap:8px}
  .hero-bottom{gap:12px}
  .scene-label span{display:none}
  .demo-workspace{padding:10px}
  .demo-controls{padding-inline:2px}
  .compare .package-scene{width:78%;left:11%;top:23%}
  .comparison-label.after{right:10px}
  .comparison-label.before{left:10px}
}

/* Studio lighting and a centered product reveal. */
:root{
  --headline:'Logokat Inter',sans-serif;
  --paper:#f5f5f7;
  --ink:#1d1d1f;
  --dark:#000000;
  --graphite:#181819;
  --accent:#0071e3;
  --line:#d2d2d7;
}
body{font-family:var(--headline);background:var(--paper)}
.site-header{
  height:56px;
  justify-content:space-between;
  background:#161617;
  border-color:#ffffff1a;
}
.brand{font-size:23px;letter-spacing:-.07em}
.desktop-nav a{font-size:13px;font-weight:500;color:#dedddd}
.btn{border-radius:999px;min-height:44px;gap:14px;padding:12px 19px;font-size:14px;font-weight:650}
.btn:hover{transform:none}
.btn-header{min-height:36px;padding-block:6px;background:var(--accent);color:#fff}
.btn-header:hover{background:#0067ce}
.btn-accent:hover{background:#0067ce}
.scroll-progress{height:2px}
.hero{
  display:grid;
  grid-template-rows:auto minmax(320px,1fr) auto;
  justify-items:center;
  align-items:stretch;
  gap:0;
  height:max(800px,100svh);
  min-height:0;
  padding:clamp(77px,10vh,115px) var(--content-gutter) 24px;
  text-align:center;
  color:#f5f5f7;
  background:radial-gradient(ellipse at 50% 61%,#29292c 0%,#141416 35%,#000 72%);
}
.hero-copy{width:100%;margin:0}
.hero-kicker{margin:0 0 8px;font-size:19px;font-weight:650;letter-spacing:-.025em}
.hero h1{
  white-space:normal;
  margin:0 auto;
  max-width:19ch;
  font-size:clamp(42px,5.6vw,82px);
  letter-spacing:-.058em;
  line-height:1;
  text-wrap:balance;
}
.hero-lead{
  margin:12px auto 0;
  max-width:40ch;
  color:#d2d2d7;
  font-size:clamp(15px,1.65vw,22px);
  line-height:1.35;
}
.hero-visual{
  position:relative;
  inset:auto;
  margin:0;
  width:min(100%,1050px);
  height:100%;
  min-height:0;
}
.hero-ctas{justify-content:center;gap:12px 24px;margin:0}
.hero .text-link{
  min-height:44px;
  padding:0;
  color:#2997ff;
  border:0;
  font-size:14px;
  gap:6px;
}
.hero .text-link:hover{text-decoration:underline;text-underline-offset:4px}
.hero-visual .fallback-handle{height:168px}
.hero-visual .fallback-head{top:calc(50% + 71px);width:80px;height:49px}
.section-pad:not(.hero){padding-block:clamp(58px,8vw,128px)}
.section-index{font-size:12px;font-weight:650;letter-spacing:.065em;color:#6e6e73;margin-bottom:20px}
.section-index.light{color:#c8c8cd}
.display-heading,.engineering-copy .display-heading,.feature-intro .display-heading,
.builder-title .display-heading,.trans-head .display-heading{
  font-weight:750;
  font-size:clamp(38px,5.5vw,80px);
  letter-spacing:-.06em;
  line-height:1.02;
  text-wrap:balance;
}
.manifesto{background:#fff;text-align:center}
.manifesto-grid{display:block}
.manifesto-copy{border:0;padding:0;margin:20px auto 0;max-width:55ch}
.manifesto-copy p{max-width:none;font-size:clamp(17px,2vw,22px)}
.section-link{color:#0066cc;text-decoration:underline;text-underline-offset:5px}
.engineering-grid{grid-template-columns:minmax(0,1fr) minmax(0,1.45fr)}
.engineering-scene{
  border:0;
  background:radial-gradient(ellipse at center,#3a3a3c,#262627 58%,#1d1d1e);
  border-radius:20px;
}
.scene-label:before{background:#a1a1a6}
.scene-caption{color:#ccccd0}
.mode-switch{border-radius:999px;background:#212122;border-color:#5c5a58}
.mode{border-radius:999px}
.how{background:#fff}
.how-head,.trans-head{flex-direction:column;align-items:flex-start;gap:14px}
.how-head>p,.builder-title>p,.trans-head>p{max-width:46ch;font-size:17px;line-height:1.5}
.demo-workspace{padding:0;border:0;background:none;overflow:visible}
.craft-board{border:0;border-radius:20px}
.demo-controls{padding-inline:0}
.features{background:#f5f5f7}
.features .section-index{color:#6e6e73}
.feature-cards{display:block;border-top:1px solid var(--line)}
.feature-card,.feature-card + .feature-card{
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(0,1.4fr);
  align-items:baseline;
  padding:20px 0;
  gap:6px 28px;
  background:none;
  border:0;
  border-bottom:1px solid var(--line);
  border-radius:0;
}
.feature-card h3,.feature-card p{grid-column:auto;margin:0}
.feature-card h3{font-size:clamp(19px,2vw,26px)}
.feature-card p{max-width:50ch;font-size:16px}
.builder{background:var(--paper)}
.builder-shell{border-color:var(--line);border-radius:20px}
.builder-preview{background:#ececf0}
.compare{border:0;border-radius:20px;background:#29292b}
.compare-before{background:#29292b}
.faq-grid{grid-template-columns:minmax(0,1fr) minmax(0,1.4fr)}
.final-cta{
  display:flex;
  flex-direction:column;
  gap:24px;
  text-align:center;
  background:#f5f5f7;
  color:var(--ink);
}
.final-cta h2{margin:0;font-size:clamp(34px,5.2vw,74px);text-wrap:balance}
.site-footer{background:var(--dark);border-color:#ffffff22}

@media(max-width:800px){
  .mobile-menu{top:56px;background:#161617}
  .menu-toggle{min-width:44px;min-height:44px}
  .hero{height:max(690px,100svh);padding-top:78px;padding-bottom:20px}
  .hero h1{font-size:clamp(40px,8vw,65px)}
  .engineering-grid,.faq-grid{grid-template-columns:minmax(0,1fr)}
  .engineering-copy .mode-description{min-height:0}
}
@media(max-width:520px){
  .hero h1{font-size:clamp(36px,9.4vw,48px)}
  .hero-ctas{flex-direction:row;flex-wrap:wrap;align-items:center;gap:6px 15px}
  .hero .text-link,.hero .btn{font-size:13px}
  .feature-card,.feature-card + .feature-card{grid-template-columns:minmax(0,1fr)}
  .demo-controls{padding-top:12px}
}

/* The model is the stage. Part names sit below it, clear of the rotating mesh. */
.engineering{
  text-align:center;
  background:radial-gradient(ellipse at 50% 53%,#333335 0%,#222224 32%,#151516 65%);
}
.engineering-copy>p{
  margin:16px auto 0;
  max-width:48ch;
  color:#c5c5ca;
  font-size:clamp(16px,2vw,20px);
  line-height:1.45;
}
.engineering-scene{
  width:min(100%,880px);
  height:clamp(350px,49vw,560px);
  min-height:0;
  margin:4px auto 0;
  border-radius:0;
  background:none;
}
.engineering-scene .fallback-handle{height:155px}
.engineering-scene .fallback-head{top:calc(50% + 64px);width:80px;height:48px}
.engineering-controls .mode-switch{margin-top:0}
.engineering-controls .mode-description{
  margin:12px 0 0;
  min-height:3em;
  color:#c5c5ca;
  font-size:13px;
  line-height:1.45;
}
.engineering-parts{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  width:min(100%,880px);
  margin:24px auto 0;
  text-align:left;
  border-top:1px solid #ffffff30;
}
.engineering-parts>div{padding:20px clamp(12px,3vw,32px) 0}
.engineering-parts>div:first-child{padding-left:0}
.engineering-parts>div+div{border-left:1px solid #ffffff30}
.engineering-parts dt{font-weight:650;font-size:clamp(16px,2vw,21px)}
.engineering-parts dd{margin:6px 0 0;color:#c5c5ca;font-size:14px;line-height:1.45}

/* A material sample and a lightweight set of controls. */
.builder{background:#f5f5f7}
.builder-title{flex-direction:column;align-items:center;text-align:center;gap:12px}
.builder-title>p{max-width:45ch}
.builder-shell{
  grid-template-columns:minmax(0,1.35fr) minmax(280px,1fr);
  align-items:start;
  gap:clamp(24px,5vw,76px);
  min-height:0;
  border:0;
  border-radius:0;
  background:none;
  overflow:visible;
}
.builder-preview{background:none;padding:0}
.preview-stage{
  display:grid;
  place-items:center;
  padding:clamp(24px,5vw,72px);
  min-height:clamp(270px,38vw,510px);
  border-radius:20px;
  background:radial-gradient(ellipse at 50% 35%,#fff 0%,#e9e9ed 85%);
}
.preview-board{
  width:100%;
  min-height:0;
  aspect-ratio:1.52;
  border-radius:3px;
  transform:perspective(900px) rotateX(9deg) rotateZ(-5deg);
  box-shadow:0 1px 1px #0003,0 15px 22px #0002;
}
.preview-board::before{opacity:.035}
.preview-band{top:35%;height:30%;transform:none;border-width:2px}
.preview-repeat{font-size:clamp(17px,3vw,39px);letter-spacing:-.035em}
.preview-repeat .mask-logo{display:inline-block;width:clamp(56px,14vw,145px);height:clamp(28px,5vw,68px)}
.preview-footer{
  padding:8px 0 0;
  font-size:13px;
  font-weight:500;
  letter-spacing:0;
}
.preview-footer .inline-action{
  min-height:44px;
  color:#0066cc;
  border:0;
  text-transform:none;
  letter-spacing:0;
  font-size:14px;
}
.builder-panel{min-width:0;padding:4px 0 0}
.builder-panel .field-label{
  margin:20px 0 9px;
  gap:8px;
  color:var(--ink);
  font-size:14px;
  letter-spacing:0;
  text-transform:none;
}
.builder-panel .field-label:first-child{margin-top:0}
.builder-panel .field-label span{color:#6e6e73}
.brand-input{
  padding:11px 13px;
  border:1px solid #d2d2d7;
  border-radius:9px;
  font-size:20px;
  font-weight:650;
}
.builder-panel small{margin:7px 0 0;font-size:12px}
.file-input-label{
  display:flex;
  align-items:center;
  flex-wrap:wrap;
  gap:4px 10px;
  min-height:44px;
  border:0;
  margin:4px 0 0;
  padding:6px 0;
  color:#0066cc;
  font-size:14px;
  font-weight:600;
}
.file-input-label span{font-size:11px;color:#6e6e73;margin:0;font-weight:500}
.builder-swatch,.builder-swatch.active{padding:0;display:grid;place-items:center;width:44px;border-radius:50%;background:#fff}
.builder-swatch span{width:30px;height:30px}
.surface-switch{gap:4px;border-radius:12px;padding:3px;background:#f5f5f7}
.surface-switch button{border-color:transparent;border-radius:9px;background:transparent;font-size:12px}
.surface-switch button.active{background:#fff;border-color:#d2d2d7;font-weight:650}
.builder-panel .btn-full{justify-content:center;margin-top:20px}
.builder-panel .micro-note{text-align:center;font-size:12px}

@media(max-width:740px){
  .builder-shell{grid-template-columns:minmax(0,1fr)}
  .preview-stage{min-height:0;padding:clamp(28px,9vw,60px)}
  .preview-board{max-width:460px}
}
@media(max-width:520px){
  .engineering-parts>div{padding:14px 6px 0}
  .engineering-parts dd{font-size:12px}
}

/* Final spacing and material treatment across the product story. */
html{scroll-padding-top:24px}
.desktop-nav a,.mobile-menu a{transition:color .2s}
.desktop-nav a:focus-visible{border-radius:4px}
.site-header .brand{font-weight:800}
.hero-kicker{color:#ececef}
.hero h1{max-width:22ch}
.hero .product-canvas{filter:drop-shadow(0 18px 24px #0006)}
.manifesto .section-index{color:#6e6e73;letter-spacing:0}
.manifesto-copy{max-width:52ch}
.manifesto-copy p{color:#6e6e73;font-weight:550}
.section-link{font-weight:500;text-decoration:none}
.section-link:hover{text-decoration:underline}
.engineering-parts dd{color:#aeb0b5}
.engineering-parts dt{letter-spacing:-.025em}
.how-head{align-items:center;text-align:center}
.how-head>p{color:#6e6e73;margin-inline:auto}
.how>.section-index{text-align:center;letter-spacing:0}
.craft-board{
  height:clamp(300px,39vw,550px);
  background:linear-gradient(115deg,#d2b38b,#c7a477 60%,#bf996b);
}
.craft-pattern{opacity:.065}
.craft-board:after{opacity:.25}
.demo-workspace{position:relative;max-width:1200px;margin-inline:auto}
.demo-controls{padding-top:22px;gap:16px}
.swatch{width:36px;height:36px;border-width:6px}
.demo-disclaimer{max-width:80ch;margin:18px auto 0;text-align:center;font-size:12px;line-height:1.55}
.features{background:#fff}
.features .section-index{letter-spacing:0}
.feature-intro .display-heading{font-size:clamp(32px,4vw,58px)}
.feature-cards{border-top:0}
.feature-card,.feature-card + .feature-card{padding-block:24px}
.feature-card h3{letter-spacing:-.025em}
.feature-card p{color:#6e6e73}
.builder-shell{gap:clamp(24px,5vw,80px)}
.builder-preview{position:sticky;top:24px}
.preview-stage{min-height:clamp(300px,40vw,560px);border-radius:24px}
.preview-board{aspect-ratio:1.35}
.preview-band{top:38%;height:24%;border-width:2px}
.brand-input{min-height:52px;background:#fff;font-size:19px;font-weight:550}
.builder-panel .field-label{font-size:15px}
.builder-panel .field-label:not(:first-child){margin-top:25px}
.builder-panel .btn-full{min-height:50px}
.preview-footer{color:#6e6e73}
.transformation .section-index{letter-spacing:0}
.trans-head{align-items:center;text-align:center}
.trans-head>p{color:#c5c5ca}
.compare{background:radial-gradient(ellipse at 50% 45%,#363638,#242426 75%)}
.compare-before{background:radial-gradient(ellipse at 50% 45%,#363638,#242426 75%)}
.comparison-label{font-size:10px;letter-spacing:.05em;border-radius:999px}
.faq{background:#fff}
.faq summary{font-size:17px;letter-spacing:-.02em}
.faq details p{font-size:15px;color:#6e6e73}
.final-cta{background:#f5f5f7}
.site-footer>span{color:#a1a1a6;font-size:10px;letter-spacing:.03em}

@media(max-width:740px){
  .builder-preview{position:static}
  .preview-stage{min-height:0}
}
@media(max-width:520px){
  .hero{grid-template-rows:auto minmax(285px,1fr) auto}
  .hero h1{font-size:clamp(34px,9.2vw,46px)}
  .hero-lead{max-width:30ch;font-size:15px}
  .demo-controls .color-control{flex-wrap:wrap;gap:12px}
  .control-label{font-size:10px;letter-spacing:.03em}
  .faq summary{font-size:15px}
}

/* A fixed frontal view of the shared GLB moves along the imprint. */
.craft-board{--roller-height:clamp(185px,24vw,285px);--print-height:clamp(36px,5vw,65px)}
.craft-board:after{display:none}
.print-path{
  left:12%;
  top:62%;
  width:76%;
  height:var(--print-height);
  transform:translateY(-50%);
}
.print-content{justify-content:flex-start;gap:24px;font-size:clamp(14px,2.5vw,32px);border-width:2px}
.print-content span{flex-shrink:0}
.demo-roller{
  position:absolute;
  z-index:4;
  left:12%;
  top:calc(62% - var(--roller-height) * .31);
  width:calc(var(--roller-height) * .5628);
  height:var(--roller-height);
  margin-left:0;
  transform:none;
  filter:none;
  pointer-events:none;
}
.demo-product{display:block;width:100%;height:100%;object-fit:contain;transform:rotate(180deg)}
@media(max-width:520px){
  .craft-board{--roller-height:185px}
  .print-content{gap:15px;font-size:14px}
}

.engineering-photo-stage{
  display:grid;
  grid-template-columns:minmax(0,1fr);
  grid-template-rows:minmax(0,1fr);
  place-items:center;
  padding:24px 0;
}
.engineering-product-photo{
  grid-area:1 / 1;
  display:block;
  width:100%;
  height:100%;
  max-width:500px;
  min-height:0;
  object-fit:contain;
  transform:rotate(-9deg);
  filter:drop-shadow(0 18px 20px #0005);
}
.engineering-product-photo-front{opacity:0}
.engineering-photo-caption{
  margin:12px 0 0;
  color:#c5c5ca;
  font-size:13px;
  line-height:1.5;
}

/* A sheet of paper moves over the receding product stage. */
@media(prefers-reduced-motion:no-preference){
  main > .section-pad.section-handoff{
    --overlap:clamp(36px,7svh,72px);
    --edge-radius:48px;
    position:relative;
    z-index:5;
    margin-top:calc(-1 * var(--overlap));
    padding-bottom:calc(clamp(58px,8vw,128px) + var(--overlap));
    border-radius:calc(var(--edge-radius) * (1 - var(--handoff,0))) calc(var(--edge-radius) * (1 - var(--handoff,0))) 0 0;
    box-shadow:0 -18px 48px #00000018;
  }
  main > .section-pad.section-handoff:last-child{padding-bottom:clamp(58px,8vw,128px)}
  .section-handoff > :is(.section-index,.manifesto-grid,.engineering-copy,.how-head,
    .feature-intro,.builder-title,.trans-head,h2),
  .section-handoff > .faq-grid > h2{
    opacity:var(--paper-reveal,1);
    transform:translateY(calc(28px * (1 - var(--paper-reveal,1))));
  }
  .section-handoff > .manifesto-grid:focus-within{opacity:1}
}
@media(max-width:520px) and (prefers-reduced-motion:no-preference){
  main > .section-handoff{--edge-radius:28px}
}

.prototype-gallery{
  max-width:1080px;
  margin:clamp(52px,8vw,104px) auto 0;
  text-align:left;
}
.prototype-gallery-heading{
  margin-bottom:24px;
  padding-top:24px;
  border-top:1px solid #ffffff30;
}
.prototype-gallery-heading h3{
  margin:0;
  font-size:clamp(26px,4vw,46px);
  letter-spacing:-.045em;
  line-height:1.05;
}
.prototype-gallery-heading p{margin:12px 0 0;color:#c5c5ca;line-height:1.5}
.prototype-gallery figure{
  margin:0;
  min-width:0;
  background:#222225;
  border:1px solid #ffffff12;
  border-radius:20px;
}
.prototype-gallery .prototype-feature{
  display:grid;
  grid-template-columns:minmax(0,2.15fr) minmax(0,1fr);
  align-items:center;
  gap:clamp(20px,4vw,52px);
  padding:clamp(22px,5vw,58px);
  background:radial-gradient(ellipse at 35% 42%,#34343d,#222225 72%);
}
.prototype-gallery img{
  display:block;
  width:100%;
  height:100%;
  min-width:0;
  min-height:0;
  object-fit:contain;
}
.prototype-feature img{height:clamp(140px,24vw,275px)}
.prototype-gallery figcaption strong{display:block;font-size:clamp(17px,2.2vw,23px);letter-spacing:-.025em}
.prototype-gallery figcaption span{display:block;margin-top:7px;color:#c5c5ca;font-size:14px;line-height:1.45}
.prototype-details{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin-top:14px}
.prototype-details figure{padding:clamp(16px,2.1vw,24px)}
.prototype-views{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:12px;
  height:clamp(100px,15vw,170px);
  margin-bottom:18px;
}
@media(max-width:740px){
  .prototype-gallery .prototype-feature{grid-template-columns:minmax(0,1fr)}
  .prototype-details{grid-template-columns:minmax(0,1fr)}
  .prototype-views{height:150px}
}

.roller-color-filter{position:absolute;pointer-events:none}
.roller-colors{border:0;padding:0;margin:0 auto 10px;min-width:0}
.roller-colors legend{margin:auto;color:#d2d2d7;font-size:12px}
.roller-color-options{display:flex;justify-content:center}
.roller-color-options label{position:relative;display:grid;place-items:center;width:44px;height:44px;cursor:pointer}
.roller-color-options input{position:absolute;opacity:0}
.roller-color-options span{
  display:block;
  width:27px;
  height:27px;
  border:1px solid #ffffff60;
  border-radius:50%;
  background:var(--sample);
}
.roller-color-options input:checked + span{outline:2px solid #f5f5f7;outline-offset:3px}
.roller-color-options input:focus-visible + span{outline:2px solid #65b5ff;outline-offset:4px}

.roller-preview-settings{
  display:flex;
  justify-content:center;
  align-items:start;
  flex-wrap:wrap;
  gap:8px 22px;
  margin:0 auto 12px;
}
.roller-preview-settings fieldset{border:0;padding:0;margin:0;min-width:0}
.roller-preview-settings legend{margin:auto;color:#d2d2d7;font-size:12px}
.roller-color-name{display:block;color:#f5f5f7;font-size:12px;font-weight:600}
.roller-background-options{
  display:flex;
  min-height:44px;
  align-items:center;
  justify-content:center;
}
.roller-background-options label{position:relative;display:grid;place-items:center;min-height:44px;cursor:pointer}
.roller-background-options input{position:absolute;opacity:0}
.roller-background-options span{
  display:block;
  padding:6px 9px;
  border:1px solid transparent;
  border-radius:999px;
  color:#d2d2d7;
  font-size:12px;
}
.roller-background-options input:checked + span{background:#f5f5f7;color:#1d1d1f}
.roller-background-options input:focus-visible + span{outline:2px solid #65b5ff;outline-offset:2px}
@media(max-width:420px){
  .roller-preview-settings{gap:6px 12px}
  .roller-color-options label{width:38px}
}
@media(max-width:520px){
  .hero-kicker{font-size:16px;margin-bottom:6px}
  .hero-lead{margin-top:8px}
  .hero .hero-ctas{gap:6px 12px}
  .roller-preview-settings{margin-bottom:8px}
}
@media(max-width:360px){
  .hero h1{font-size:clamp(27px,8.7vw,32px)}
}

.brand img,.hero-kicker img{display:block;width:auto;height:30px}
.hero-kicker img{height:26px;margin-inline:auto}
@media(max-width:520px){
  .brand img{height:28px}
  .hero-kicker img{height:22px}
}

/* ROLLÉ's own material palette: warm paper, workshop graphite and ink coral. */
:root{
  --paper:#f3efe6;
  --bg:#f3efe6;
  --ink:#20211e;
  --dark:#171916;
  --graphite:#20221f;
  --accent:#d76b55;
  --paper-accent:#b94f3e;
  --line:#d7d0c3;
  --kraft:#c9a476;
}
body{background:var(--paper)}
.manifesto,.how,.faq,.builder,.features,.final-cta{background:var(--paper)}
.engineering,.transformation{background:#20221f}
.hero{background:radial-gradient(ellipse at 50% 58%,#30312d 0%,#1b1d1a 43%,#111310 78%)}
.site-header{background:#171916}
.btn{border-radius:9px}
.btn-header,.btn-accent{background:#c4523d;color:#fff}
.btn-header:hover,.btn-accent:hover{background:#b34633}
.hero .text-link{color:#e58a72}
.section-link,.reset-logo{color:var(--paper-accent)}
.section-link span{color:var(--paper-accent)}
.scroll-progress{background:var(--accent)}
.engineering-scene{background:radial-gradient(ellipse at center,#3a3b35,#292b26 60%,#222420)}
.mode-switch{border-radius:8px}
.mode{border-radius:5px}
.builder-shell{background:#fbf9f3}
.builder-preview{background:#e9e2d5}
.preview-board{background:#c9a575}
.file-input-label,.builder-swatch,.surface-switch button{border-radius:6px}
.surface-switch button.active{background:#f3e6df;border-color:var(--paper-accent)}
.faq-list,.faq details{border-color:var(--line)}
.final-cta{color:var(--ink)}
.site-footer{background:#171916}
::selection{background:#f0c4b8;color:#20211e}

/* The print wheel sits on the ink line, and the handle stays inside the card. */
.print-path{
  left:20%;
  top:72%;
  width:60%;
}
.demo-roller{
  top:calc(72% - var(--roller-height) * .32);
}

/* The before/after box needs room inside the frame, with a whole word on the branded side. */
.compare{height:clamp(440px,52vw,580px)}
.package-scene,
.compare .package-scene,
.compare-before .package-scene{
  width:min(64%,440px);
  left:50%;
  top:12%;
  transform:translateX(-50%) skewY(-3deg) rotate(-3deg);
}
.compare-base .package-face::before{content:none}
/* The customizer sample shows whole words, and the preview column matches the form. */
#customizer .builder-shell{
  align-items:stretch;
  background:transparent;
}
#customizer .builder-preview{
  display:flex;
  flex-direction:column;
  background:transparent;
}
#customizer .preview-stage{
  flex:1;
  background:radial-gradient(ellipse at 50% 35%,#fff 0%,#efe8dc 82%);
}
#customizer .preview-board{overflow:hidden}
#customizer .preview-band{
  left:4%;
  width:92%;
  top:50%;
  height:auto;
  transform:translateY(-50%);
  overflow:hidden;
}
#customizer .preview-repeat{
  width:max-content;
  max-width:100%;
  margin-inline:auto;
  line-height:1;
}
#customizer .preview-footer{padding:16px 4px 0}
#customizer .preview-footer .inline-action,
#customizer .file-input-label{color:#b94f3e}
#customizer .preview-export-note{
  margin:6px 4px 0;
  max-width:34ch;
  color:#6e6e73;
  font-size:12px;
  line-height:1.45;
}
#customizer .logo-check{
  margin:8px 0 0;
  padding:10px 12px;
  border:1px solid var(--line);
  border-radius:8px;
  background:#f7f2ea;
  color:#515154;
  font-size:12px;
  line-height:1.45;
}
#customizer .logo-check.is-warn{
  border-color:#d7a28f;
  background:#f8ebe6;
  color:#5f3428;
}
#customizer .logo-check.is-ok{
  border-color:#c9d2be;
  background:#eef3e8;
  color:#3d4735;
}
#customizer .field-label span{flex:none;margin-left:12px;white-space:nowrap}
#customizer .density-range{
  --density-fill:50%;
  -webkit-appearance:none;
  appearance:none;
  display:block;
  width:100%;
  height:28px;
  margin:4px 0 0;
  background:transparent;
  cursor:pointer;
}
#customizer .density-range:focus-visible{outline:none}
#customizer .density-range::-webkit-slider-runnable-track{
  height:6px;
  border-radius:999px;
  background:linear-gradient(90deg,var(--accent) 0 var(--density-fill),#ddd4c6 var(--density-fill) 100%);
}
#customizer .density-range::-webkit-slider-thumb{
  -webkit-appearance:none;
  appearance:none;
  width:22px;
  height:22px;
  margin-top:-8px;
  border:2px solid #fff;
  border-radius:50%;
  background:var(--accent);
  box-shadow:0 1px 4px #0003;
  transition:transform .16s ease;
}
#customizer .density-range:active::-webkit-slider-thumb{transform:scale(1.08)}
#customizer .density-range::-moz-range-track{
  height:6px;
  border:0;
  border-radius:999px;
  background:#ddd4c6;
}
#customizer .density-range::-moz-range-progress{
  height:6px;
  border:0;
  border-radius:999px;
  background:var(--accent);
}
#customizer .density-range::-moz-range-thumb{
  width:22px;
  height:22px;
  border:2px solid #fff;
  border-radius:50%;
  background:var(--accent);
  box-shadow:0 1px 4px #0003;
}
#customizer .preview-repeat,
#customizer .print-content,
#customizer .package-print{
  transition:gap .18s ease;
}

/* Request dialog: paper card, clear summary, quiet next-step copy. */
.request-dialog{
  width:min(560px,calc(100vw - 28px));
  height:min(620px,calc(100dvh - 28px));
  max-height:calc(100dvh - 28px);
  margin:auto;
  border:1px solid #ddd4c6;
  border-radius:20px;
  padding:0;
  overflow:hidden;
  background:
    linear-gradient(180deg,#fffdf8 0%,#f6f0e6 100%);
  color:var(--ink);
  box-shadow:0 24px 80px #17191655;
}
.request-dialog::backdrop{
  background:#171916b8;
  backdrop-filter:blur(8px);
}
.request-form{
  container-type:inline-size;
  position:relative;
  display:grid;
  grid-template-rows:minmax(0,1fr) auto;
  height:100%;
  min-height:0;
  gap:0;
  margin:0;
  padding:0;
}
.request-content{min-height:0;overflow-y:auto;overscroll-behavior:contain;scrollbar-gutter:stable;padding:24px 24px 20px}
.request-heading{display:flex;align-items:flex-start;justify-content:space-between;gap:16px}
.request-heading h3{min-width:0}
.request-dialog .close-dialog{
  position:static;
  flex-shrink:0;
  width:44px;
  height:44px;
  display:grid;
  place-items:center;
  padding:0;
  border:1px solid #e2d8ca;
  border-radius:10px;
  background:#fff;
  color:var(--ink);
  font-size:24px;
  line-height:1;
}
.request-dialog .close-dialog:hover{background:#efe8dc}
.request-form h3{
  margin:0;
  max-width:none;
  font-family:var(--headline);
  font-size:clamp(24px,5.4cqi,30px);
  font-weight:800;
  line-height:1.15;
  letter-spacing:-.035em;
  text-transform:none;
}
.request-form h3 em{
  display:block;
  font-style:normal;
  color:var(--paper-accent);
}
.request-lead{
  margin:10px 0 0;
  max-width:52ch;
  color:#6a645c;
  font-size:13px;
  line-height:1.5;
  font-weight:500;
}
/* The request carries a proof and a concise specification. */
.request-summary{display:grid;gap:16px;margin:20px 0 0;padding:0;border:0;border-radius:0;background:transparent;font-size:13px;line-height:1.4}
.request-summary-title{display:flex;align-items:center;justify-content:space-between;gap:16px;color:#55594f;font-size:12px;font-weight:600}
.request-summary-title button{padding:4px 0;border:0;border-bottom:1px solid #b64a36;background:transparent;color:#a83b29;font-size:12px;font-weight:600}
.request-imprint{display:grid;place-items:center;min-height:110px;padding:26px 20px;background:repeating-linear-gradient(87deg,#84603b09 0 1px,transparent 1px 4px),linear-gradient(120deg,#d6b588,#bd986a)}
.request-imprint[data-surface="white"]{background:linear-gradient(120deg,#fffef9,#e9e6dc)}
.request-imprint[data-surface="dark"]{background:linear-gradient(120deg,#454740,#252822)}
.request-imprint-band{width:100%;padding:6px 0;border-block:2px solid currentColor;color:var(--proof-ink);text-align:center;font-size:clamp(18px,5cqi,30px);font-weight:800;line-height:1.2;overflow-wrap:anywhere;letter-spacing:-.04em}
.request-imprint-logo{display:block;width:100%;height:42px;background:currentColor;mask-size:contain;mask-position:center;mask-repeat:no-repeat}
.request-summary-facts{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px 22px;margin:0;padding:0 0 16px;border-bottom:1px solid #d7cec0}
.request-summary .request-summary-row{display:block;min-width:0;padding:0;border:0}
.request-summary-key{margin:0 0 3px;color:#79766d;font-size:11px;font-weight:500}
.request-summary-val{margin:0;color:var(--ink);font-size:13px;font-weight:600;overflow-wrap:anywhere}
.request-fields{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:12px;
  margin-top:16px;
}
.request-form label{
  display:flex;
  flex-direction:column;
  gap:8px;
  margin:0;
  color:var(--ink);
  font-size:13px;
  font-weight:650;
  letter-spacing:0;
  text-transform:none;
  min-width:0;
}
.request-form label>span{display:flex;align-items:baseline;justify-content:space-between;gap:6px;flex-wrap:wrap}
.request-form label small{font-size:10px;font-weight:400;letter-spacing:0}
.request-form label input{
  width:100%;
  min-width:0;
  min-height:46px;
  padding:11px 13px;
  border:1px solid #d7cec0;
  border-radius:10px;
  background:#fff;
  color:var(--ink);
  font-size:15px;
  font-weight:500;
  outline:0;
  transition:border-color .15s ease, box-shadow .15s ease;
}
.request-form label input::placeholder{color:#9a948b}
.request-form label input:focus{
  border-color:var(--paper-accent);
  box-shadow:0 0 0 3px #d76b5528;
}
.request-field{min-width:0}
.request-form .request-field-error{margin:7px 0 0;max-width:none;font-size:12px;line-height:1.45;color:#a32f22}
.request-field-error[hidden]{display:none}
.request-form label input[aria-invalid="true"]{border-color:#a32f22;background:#fff9f7}
.request-form label input[aria-invalid="true"]:focus{box-shadow:0 0 0 3px #a32f2220}
.request-actions{
  display:grid;
  gap:8px;
  margin:0;
  padding:16px 24px 18px;
  border-top:1px solid #e2d8ca;
  background:#f8f3ea;
}
.request-actions .btn-full{
  justify-content:center;
  min-height:50px;
  border-radius:12px;
  margin-top:0;
}
.request-next{
  margin:0;
  color:#5f5850;
  font-size:13px;
  line-height:1.5;
}
.request-form small,
.request-actions small{
  display:block;
  margin:0;
  color:#8a847a;
  font-size:12px;
  line-height:1.45;
  text-align:left;
}
@media(max-width:520px){
  .request-content{padding:18px}
  .request-top{padding:12px 18px 8px}
  .request-actions{padding:12px 18px 14px}
  .request-summary-row{grid-template-columns:90px minmax(0,1fr);gap:6px 10px}
  .request-fields{grid-template-columns:minmax(0,1fr)}
}
.site-footer{
  display:grid;
  grid-template-columns:auto minmax(0,1fr) auto;
  align-items:center;
  gap:12px 24px;
  padding-block:24px;
}
.site-footer .brand img{width:108px;height:auto}
.site-footer > a:last-child{white-space:nowrap;min-height:40px;display:flex;align-items:center;justify-content:flex-end}
.footer-copy{
  display:flex;
  flex-direction:column;
  gap:4px;
  min-width:0;
}
.footer-copy>span{
  color:#a1a1a6;
  font-size:10px;
  font-weight:750;
  letter-spacing:.04em;
  line-height:1.4;
}
.footer-concept{
  margin:0;
  max-width:56ch;
  color:#a7a49c;
  font-size:12px;
  line-height:1.45;
  letter-spacing:0;
  text-transform:none;
  font-weight:450;
}
@media(max-width:700px){
  .site-footer{
    grid-template-columns:1fr auto;
    padding-block:20px;
  }
  .footer-copy{grid-column:1 / -1;order:3}
}

.compare-base .package-face::after{content:none}

/* The roller meets the top edge of a box. The repeating line is a preview, not a tested print. */
.craft-board{
  --contact:50%;
  --flap:clamp(36px,7vw,56px);
  --roller-height:clamp(180px,22vw,250px);
  height:clamp(460px,54vw,580px);
  background:
    radial-gradient(ellipse at 50% 42%, #f6f1e6 0%, #e4d9c8 78%);
  border:0;
}
.mailer{
  position:absolute;
  z-index:1;
  left:4%;
  width:92%;
  top:auto;
  bottom:5%;
  aspect-ratio:1903 / 826;
  transform:translateY(11.7%);
}
.mailer-photo{display:block;width:100%;height:100%;object-fit:contain;opacity:0}
.mailer.is-loaded .mailer-photo{opacity:1}
.mailer{background:url("data:image/webp;base64,UklGRmIDAABXRUJQVlA4WAoAAAAQAAAAXwAAKQAAQUxQSLwBAAABf8MokiRF290zi2/yr5XuHEREBvxIMJyrl7xKyg0nCbjMRBB34ptjDyhqG8mZ8tq94495G4CI/k8AwOIywTVfXzdow6t5weo6go6tbWvE5nl/zZgrZjuMXbaSPSTLTc3MHePoewqNbMEfKCNiAvjfND1wlVY9eMZA8hQHjjf+OKiApQY0IBhj0KAITpx4ToLi002dycDLD1/881gaU6UwU0FsgrCEEwFUCxREUMc3aZMGr797iR7fZBquHC95agu5p/FwmjSev8mphQ4nQHL1bSoQ+0MR4O47R9li3IFA1MYzxmV2PMhug5vYddbyjHta/RzpXeyd6d3qcUezrrRj8Vx6FaZS9FumdsuZRWMX5l1i63GhzPTbGbsFbiy4l6wQ5+IuthnPbDAu0c640naXORGgXC7gdpYcuM5U1pAd1+H9a0cnpS4l+/7i9zC5kgNdfu+nVmDyxlsVThm0YcQGRYMRigwqg2MdU2FMorZYw0iGIjVYCalqTaGR2H745Gs5e/HOMfzNMJxao2xjI45tqBGERrSlTodUS9lyIi01Xvp7zEH1WNUaVg0Z6wCT/P7jHzORPkdm0yn5bwhWUDgggAEAABAKAJ0BKmAAKgA+7WiuTimmKaMsdJxZMB2JZACEc42QPbd7ngLJi8l0mdQVI7EFG6+UYr2SrjmqGUBoUHB6TFr11yhX1zrfjhC+YHvybFaAdANJbfLNVlloAP5SKiz2Y49l1yvEU/R7G/y6Kf0hSf+iHqr12n2TcKhE35VZaYbCjvwlrC2eHdzNPLpMZR+l/DLOp/uQN/RFaHKMF84GmREn3FY2MwmYofC6vdxSxxiG+39L7atY+0Rl4FaiOUoVc6i7I9OE+xSEm9P5Fnpes31JZjYB7tLCtz4nkhFG/I/QlxXyOwx0u0HFrV2Ed3xA+gnBsv6rsOIzm2pPlkM7wxxuVym70kyhYA+lAVCrL1BfZ8SqdeEtQ1hEPl0zrpkDTMFYXpO8DoweEz7g+9qBTJ64xEfHEkEB44OdHRpMFwo+fx4luOlafCHt9+MBc219SyZpMwf4Nw23r8wo7suJT5Ctxoej3AZ1AP3ODGKsWETL5q2qcZg8cbW2FklOjgAAAA==") center / 100% 100% no-repeat}
.mailer.is-loaded{background-image:none}
.craft-board .print-content{opacity:.92}
.print-path{
  left:18%;
  top:var(--contact);
  width:58%;
  height:auto;
  transform:none;
  z-index:3;
}
.print-content{height:auto;min-height:0;padding:3px 22% 3px 0}
.demo-roller{
  top:calc(var(--contact) - var(--roller-height) * .32 + 18px);
  z-index:4;
}
@media(max-width:520px){
  .craft-board{height:360px}
}
.edge-logo{
  display:inline-block;
  width:clamp(42px,8vw,72px);
  height:clamp(18px,3vw,30px);
}
.package-print{
  position:absolute;
  z-index:2;
  left:58%;
  right:7%;
  top:18%;
  display:flex;
  align-items:center;
  min-height:0;
  padding:2px 0;
  border-top:3px solid currentColor;
  border-bottom:3px solid currentColor;
  color:#252923;
  font-family:var(--headline);
  font-size:clamp(13px,1.7vw,22px);
  font-weight:900;
  letter-spacing:-.04em;
  line-height:1.1;
  white-space:nowrap;
  overflow:hidden;
}
.package-print .edge-logo{height:1.15em;width:2.4em}

/* Composition showcase: five print parts, nothing else. */
.print-kit{
  background:
    radial-gradient(90% 70% at 50% 0%, #fffdf9 0%, transparent 60%),
    linear-gradient(180deg, #f7f1e8 0%, #efe8dc 48%, #f3efe6 100%);
}
.print-kit-intro{
  max-width:16ch;
  margin:0 0 clamp(22px,3.5vw,40px);
}
.print-kit-intro .section-index{margin-bottom:14px}
.print-kit-intro .display-heading{
  margin:0;
  font-size:clamp(42px,7vw,78px);
  line-height:.95;
}
.parts-viewer{margin:0}
.parts-viewer-stage{
  position:relative;
  min-height:clamp(360px,58vw,620px);
  border-radius:clamp(18px,2.5vw,28px);
  overflow:hidden;
  background:
    radial-gradient(70% 55% at 50% 42%, #fff 0%, #ebe3d6 55%, #e2d8c8 100%);
  box-shadow:
    0 1px 0 rgba(255,255,255,.65) inset,
    0 24px 60px rgba(40,34,28,.08);
}
.parts-viewer-canvas{
  display:block;
  width:100%;
  height:100%;
  min-height:inherit;
  touch-action:none;
  cursor:grab;
}
.parts-viewer-canvas:active{cursor:grabbing}
.parts-viewer-fallback{
  position:absolute;
  inset:0;
  display:grid;
  place-items:center;
  color:#8a847a;
  font-size:14px;
  pointer-events:none;
  transition:opacity .3s ease;
}
.parts-viewer.is-ready .parts-viewer-fallback,
.parts-viewer.is-fallback .parts-viewer-fallback{opacity:0}
.parts-viewer.is-fallback .parts-viewer-fallback{
  opacity:1;
  color:#a45a45;
}
.print-kit-legend{
  list-style:none;
  margin:clamp(18px,2.5vw,28px) 0 0;
  padding:0;
  display:flex;
  flex-wrap:wrap;
  justify-content:center;
  gap:10px 6px;
}
.print-kit-legend li{margin:0}
.print-kit-legend button{
  appearance:none;
  border:0;
  background:transparent;
  color:#5f5850;
  font:inherit;
  font-size:clamp(12px,1.5vw,14px);
  font-weight:650;
  letter-spacing:-.01em;
  padding:8px 12px;
  border-radius:999px;
  cursor:pointer;
  transition:color .2s ease, background .2s ease;
}
.print-kit-legend button span{
  display:inline-block;
  margin-right:6px;
  color:#9a9288;
  font-size:.86em;
  font-weight:750;
  letter-spacing:.04em;
}
.print-kit-legend button:hover,
.print-kit-legend button.is-active{
  background:rgba(255,255,255,.7);
  color:var(--ink);
}
.print-kit-legend button.is-active span{color:var(--paper-accent,#e58a72)}
.print-kit-legend button:focus-visible{
  outline:2px solid var(--paper-accent,#e58a72);
  outline-offset:2px;
}
.visually-hidden{
  position:absolute;
  width:1px;
  height:1px;
  padding:0;
  margin:-1px;
  overflow:hidden;
  clip:rect(0,0,0,0);
  white-space:nowrap;
  border:0;
}
@media(max-width:700px){
  .print-kit-intro{max-width:12ch}
  .parts-viewer-stage{min-height:340px}
  .print-kit-legend{justify-content:flex-start; gap:4px}
  .print-kit-legend button{padding:8px 10px}
}
@media(prefers-reduced-motion:reduce){
  .parts-viewer-fallback{transition:none}
}

/* Show one product view: the GLB after its first frame, or a photo on failure. */
[data-roller-viewer]{position:relative}
.roller-model-status{
  position:absolute;
  inset:0;
  display:grid;
  place-content:center;
  justify-items:center;
  gap:14px;
  padding:16px;
  color:#bfc3ca;
  font-size:13px;
  line-height:1.5;
  text-align:center;
  pointer-events:none;
}
.roller-model-status::before{
  content:"";
  width:24px;
  height:24px;
  border:2px solid #ffffff20;
  border-top-color:#bfc3ca;
  border-radius:50%;
}
[data-roller-viewer][data-background="light"] .roller-model-status{color:#555c67}
[data-model-ready="true"] > .roller-model-status{display:none}
[data-model-ready="false"] > .roller-model-status{
  inset:auto 12px 8px;
  z-index:3;
  display:block;
  padding:6px 10px;
  background:#181c18e6;
  border-radius:8px;
  color:#e1e3e6;
  font-size:12px;
}
[data-model-ready="false"] > .roller-model-status::before{display:none}
.roller-model-canvas{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  display:block;
  z-index:2;
  touch-action:pan-y;
  cursor:grab;
  opacity:0;
  pointer-events:none;
  filter:drop-shadow(16px 24px 18px #0005);
}
.roller-model-canvas:active{cursor:grabbing}
.roller-model-canvas:focus-visible{outline:2px solid #65b5ff;outline-offset:-4px;border-radius:20px}
.roller-model-canvas[hidden]{display:none}
[data-model-ready="true"] .roller-model-canvas{opacity:1;pointer-events:auto}
[data-roller-viewer] > img{visibility:hidden;opacity:0!important}
[data-model-ready="false"] > img:first-of-type{visibility:visible;opacity:1!important}
@media(prefers-reduced-motion:no-preference){
  .roller-model-canvas{transition:opacity .18s ease}
  [data-model-ready="loading"] > .roller-model-status::before{animation:roller-model-loading 1.2s linear infinite}
}
@keyframes roller-model-loading{to{transform:rotate(1turn)}}
[data-roller-viewer="demo"] .roller-model-canvas{
  pointer-events:none;
  cursor:default;
  filter:none;
}
[data-roller-viewer="demo"] .roller-model-status{color:#555c67;font-size:13px;gap:12px;padding:0}
[data-roller-viewer="demo"][data-model-ready="false"] > .roller-model-status{inset:auto -8px 0;padding:4px;color:#e1e3e6}

/* The tool, carton and ink share one world-space scene and one contact point. */
#craftBoard{height:clamp(280px,calc(100svh - 430px),480px);isolation:isolate}
#craftBoard > :is(.mailer,.print-path,.demo-roller){visibility:hidden}
#craftBoard[data-model-ready="false"] > :is(.mailer,.print-path,.demo-roller){visibility:visible}
#craftBoard .roller-model-canvas{border-radius:24px}
.demo-playback{
  position:absolute;
  inset:0;
  z-index:3;
  display:flex;
  align-items:flex-end;
  justify-content:flex-end;
  padding:12px;
  border:0;
  border-radius:24px;
  background:transparent;
  color:#fff;
  cursor:pointer;
}
.demo-playback:disabled{visibility:hidden}
.demo-playback span{
  opacity:0;
  padding:8px 12px;
  border-radius:8px;
  background:#20231e;
  font-size:13px;
}
.demo-playback:focus-visible{outline:2px solid #a83b29;outline-offset:4px}
.demo-playback:focus-visible span{opacity:1}
.demo-invitation{
  position:absolute;
  z-index:4;
  top:clamp(18px,3vw,32px);
  left:50%;
  transform:translateX(-50%);
  display:flex;
  flex-direction:column;
  align-items:center;
  width:calc(100% - 32px);
  max-width:420px;
  padding:8px;
  border-radius:12px;
  color:#20231e;
}
.demo-invitation[hidden]{display:none}
.demo-invitation strong{font-size:clamp(24px,4vw,40px);line-height:1.1;letter-spacing:-.045em}
.demo-invitation:hover strong{color:#a83b29}
.demo-invitation:focus-visible{outline:2px solid #a83b29;outline-offset:2px}
@media(prefers-reduced-motion:no-preference){
  .demo-invitation:not([hidden]){animation:demo-invitation-in .35s ease-out both}
  @keyframes demo-invitation-in{
    from{opacity:0;transform:translate(-50%,6px)}
    to{opacity:1;transform:translate(-50%,0)}
  }
}
@media(max-width:600px){
  #craftBoard{height:clamp(240px,68vw,360px)}
}


.product-support{background:#f4f1e9;color:#181c18}
.product-support .section-index{margin-bottom:28px}
.product-support .display-heading{font-size:clamp(36px,5vw,72px)}
.product-support-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:36px;margin-top:52px}
.product-support-grid article{border-top:1px solid #181c1833;padding-top:24px}
.product-support-label{font-size:12px;color:#55594f;margin:0 0 20px}
.product-support-grid h3{font-size:clamp(28px,3.2vw,46px);line-height:1.1;letter-spacing:-.035em;margin:0 0 18px}
.product-support-grid article>p:last-child{font-size:15px;line-height:1.6;max-width:320px;color:#55594f;margin-bottom:0}
@media(max-width:740px){
  .product-support-grid{grid-template-columns:1fr;gap:30px;margin-top:32px}
}

.faq summary span{transition:transform .48s cubic-bezier(.4,0,.2,1)}
.faq details[data-expanded="true"] summary span{transform:rotate(45deg)}
.faq details[data-expanded="false"] summary span{transform:rotate(0)}
@media(prefers-reduced-motion:reduce){
  .faq summary span{transition:none}
}

/* One product explanation and one action on the opening screen. */
#demo.hero{
  height:auto;
  min-height:0;
  grid-template-rows:auto auto auto;
  gap:18px;
  padding-top:clamp(80px,11svh,108px);
  padding-bottom:28px;
}
.hero .demo-workspace{width:min(100%,1080px);margin-top:4px}
.hero .demo-disclaimer{margin:0;color:#c5c5ca}
#hero + .manifesto.section-handoff{margin-top:0}
.hero .hero-lead{max-width:38ch;font-size:clamp(15px,1.5vw,19px);line-height:1.45}
.hero-copy .hero-ctas{
  flex-direction:row;
  flex-wrap:wrap;
  align-items:center;
  margin-top:22px;
  gap:10px 24px;
}
.hero .hero-primary-cta{
  min-height:52px;
  padding:14px 24px;
  font-size:15px;
  background:#c4523d;
  color:#fff;
  box-shadow:0 5px 24px #ee684d20;
  transition:background .2s,box-shadow .2s;
}
.hero .hero-primary-cta:hover{background:#b34633;box-shadow:0 6px 28px #ee684d35}
.final-cta .final-cta-copy{max-width:48ch;margin:18px auto 24px;color:#55594f;font-size:17px;line-height:1.55}
.engineering .roller-preview-settings{margin:20px auto 18px}
.engineering-product-photo{filter:var(--body-color-filter, ) drop-shadow(0 18px 20px #0005)}
.engineering-photo-stage::before{
  content:"";
  grid-area:1 / 1;
  width:min(100%,520px);
  height:100%;
  border-radius:24px;
  background:radial-gradient(ellipse at 48% 38%,#fff,#e3e5ed);
  opacity:0;
  pointer-events:none;
}
.engineering-photo-stage[data-background="light"]::before{opacity:1}
@media(max-width:520px){
  #demo.hero{gap:14px;padding-top:76px;padding-bottom:20px}
  .hero-copy .hero-ctas{gap:4px 16px;margin-top:18px}
  .hero .hero-primary-cta{min-height:50px;width:min(100%,320px);justify-content:center;font-size:14px;padding-inline:18px}
  .hero .hero-lead{max-width:30ch}
  .final-cta .final-cta-copy{font-size:15px}
}
@media(prefers-reduced-motion:reduce){
  .hero .hero-primary-cta{transition:none}
}

/* A delayed invitation: a visual example and one clear next step. */
.preview-offer{
  width:min(540px,calc(100vw - 32px));
  max-height:calc(100svh - 32px);
  padding:0;
  border:1px solid #ffffff30;
  border-radius:24px;
  background:#f4f1e9;
  color:#181c18;
  overflow:auto;
  overscroll-behavior:contain;
  box-shadow:0 28px 100px #0007;
}
.preview-offer::backdrop{background:#070a08b8;backdrop-filter:blur(7px)}
.preview-offer-card{position:relative}
.preview-offer-close{
  position:absolute;top:12px;right:12px;z-index:2;
  display:grid;place-items:center;width:44px;height:44px;
  padding:0;border:1px solid #181c1820;border-radius:50%;
  background:#f4f1e9ed;color:#181c18;font-size:27px;line-height:1;
}
.preview-offer-close:hover{background:#fff}
.preview-offer-art{
  position:relative;aspect-ratio:2060 / 763;overflow:hidden;
  background:#dfc9ab;
}
.preview-offer-art>img{display:block;width:100%;height:100%;object-fit:cover}
.preview-offer-art-note{
  position:absolute;bottom:8px;right:10px;padding:4px 7px;
  border-radius:4px;background:#f4f1e9e8;color:#514638;font-size:9px;
}
.preview-offer-copy{padding:28px 36px 20px;text-align:center}
.preview-offer-kicker{margin:0 0 12px;font-size:11px;font-weight:650;color:#65695e;letter-spacing:.025em}
.preview-offer h2{margin:0;font-size:clamp(29px,4.5vw,40px);line-height:1.06;font-weight:800;letter-spacing:-.05em;text-wrap:balance}
.preview-offer-copy>p:not(.preview-offer-kicker){max-width:34ch;margin:16px auto 24px;color:#5f6359;font-size:15px;line-height:1.55}
.preview-offer-cta{width:100%;min-height:52px;justify-content:center;padding-inline:16px;background:#c4523d;color:#fff;font-size:15px}
.preview-offer-cta:hover{background:#b34633}
.preview-offer-later{display:block;min-height:44px;margin:6px auto 0;padding:10px 16px;border:0;background:none;color:#5f6359;font-size:13px}
.preview-offer-later:hover{text-decoration:underline;text-underline-offset:4px}
@media(max-width:520px){
  .preview-offer-copy{padding:24px 22px 14px}
  .preview-offer-cta{font-size:14px}
}
@media(prefers-reduced-motion:no-preference){
  .preview-offer[open]{animation:preview-offer-in .3s cubic-bezier(.22,1,.36,1)}
  .preview-offer[open]::backdrop{animation:preview-offer-backdrop .25s ease}
  @keyframes preview-offer-in{from{opacity:0;transform:translateY(16px) scale(.98)}to{opacity:1;transform:none}}
  @keyframes preview-offer-backdrop{from{opacity:0}to{opacity:1}}
}

/* Live customizer: examples, a movable print strip and a replayable pass. */
.preview-toolbar{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:12px}
.preview-material-label{font-size:12px;font-weight:650;color:#55594f;padding:7px 12px;border:1px solid #d6d0c6;border-radius:999px}
.preview-run{min-height:44px;display:inline-flex;align-items:center;gap:16px;border:0;border-radius:999px;padding:10px 18px;background:#c4523d;color:#fff;font-size:13px;font-weight:700}
.preview-run:hover{background:#b34633}
.preview-run:disabled{opacity:.7;cursor:wait}
.builder #previewBand{min-height:44px;padding-block:4px;cursor:grab;touch-action:none;user-select:none;-webkit-user-select:none;border-radius:2px}
.builder #previewBand:hover,.builder #previewBand:focus-visible{outline:2px dashed #c4523d;outline-offset:8px}
.builder #previewBand.is-dragging{cursor:grabbing;outline:2px dashed #c4523d;outline-offset:8px}
.preview-print-cursor{position:absolute;z-index:3;width:18px;transform:translate(-50%,-50%);pointer-events:none;border:1px solid #1119;border-radius:5px;background:linear-gradient(90deg,#20231f,#5a6055 45%,#20231f);box-shadow:4px 2px 8px #0003}
.preview-print-cursor::before{content:"";position:absolute;width:6px;height:26px;bottom:100%;left:5px;background:#c4523d;border-radius:4px 4px 0 0}
.preview-print-cursor[hidden]{display:none}
.preview-interaction-bar{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-top:12px}
.preview-interaction-bar p{font-size:12px;line-height:1.45;color:#5f6359;margin:0;max-width:35ch}
.preview-center{flex:none;min-height:44px;padding:10px 12px;border:1px solid #d6d0c6;border-radius:999px;background:transparent;color:#3b4036;font-size:12px}
.preview-center:disabled{color:#86877d;cursor:default}
.preview-live-status{min-height:3em;margin:10px 0 0;color:#55594f;font-size:12px;line-height:1.5}
/* The printable surface follows the front panel of the photographic box. */
#customizer .preview-stage{padding:clamp(12px,2vw,24px)}
#customizer .preview-board{
  flex:none;
  width:100%;
  max-width:none;
  min-height:0;
  aspect-ratio:1448 / 1086;
  background:transparent;
  box-shadow:none;
  border-radius:0;
  transform:rotate(-2deg);
  overflow:visible;
}
#customizer .preview-board::before{content:none}
.preview-box-photo{position:absolute;inset:0;display:block;width:100%;height:100%;object-fit:contain;pointer-events:none}
.preview-print-surface,.comparison-print-surface{position:absolute;left:8.4%;top:22%;width:81%;height:66.5%;overflow:hidden}
.preview-board[data-surface="white"] .preview-box-photo,
.compare[data-surface="white"] .comparison-box-photo{filter:grayscale(1) brightness(1.6) contrast(.82)}
.preview-board[data-surface="dark"] .preview-box-photo,
.compare[data-surface="dark"] .comparison-box-photo{filter:grayscale(1) brightness(.4) contrast(1.05)}
#customizer .preview-print-surface .preview-band{opacity:.94}
/* Both comparison layers share the same image geometry; only the imprint differs. */
#details .compare{height:clamp(340px,52vw,580px)}
#details .compare,#details .compare-before{background:radial-gradient(ellipse at 50% 35%,#f7f2e8,#ded3c0)}
.comparison-box{position:absolute;width:min(92%,620px);aspect-ratio:1448 / 1086;left:50%;top:50%;transform:translate(-50%,-50%) rotate(-2deg)}
.comparison-box-photo{display:block;width:100%;height:100%;object-fit:contain}
.comparison-print-surface .package-print{left:4%;right:auto;width:92%;top:50%;transform:translateY(-50%);padding:8px 0;min-height:40px;border-width:2px;font-size:clamp(22px,3.5vw,38px);opacity:.94}
@media(max-width:740px){
  .preview-interaction-bar{align-items:flex-start}
  .preview-interaction-bar p{max-width:25ch;padding-top:4px}
  .builder-preview{margin-bottom:12px}
}


/* A physical tool is the print control on the work surface. */
#previewPrintCursor{
  width:clamp(74px,12vw,108px);
  height:clamp(140px,24vw,210px);
  left:0;
  padding:0;
  transform:translate(-50%,-90%);
  transform-origin:50% 95%;
  border:0;
  background:transparent;
  border-radius:0;
  box-shadow:none;
  cursor:grab;
  touch-action:none;
  z-index:5;
  filter:drop-shadow(4px 5px 3px #0002);
}
#previewPrintCursor::before{content:none}
#previewPrintCursor img{width:100%;height:100%;object-fit:contain;transform:rotate(180deg);pointer-events:none;user-select:none}
#previewPrintCursor.is-rolling{cursor:grabbing}
#previewPrintCursor:focus-visible{outline:2px solid #a83b29;outline-offset:4px;border-radius:8px}
#customizer .preview-print-surface{overflow:visible}
#customizer .preview-board{overflow:visible}
#customizer .preview-stage{overflow:hidden;border-radius:8px;background:#e8e3d9}
#customizer .preview-toolbar{border-bottom:1px solid #292d2430;padding-bottom:12px}
#customizer .builder-title{align-items:flex-start;text-align:left}
#customizer .builder-title h2{max-width:12ch}
#customizer .builder-title p{max-width:36ch}
#customizer .brand-input{border:0;border-bottom:2px solid #292d24;border-radius:0;background:transparent;padding-inline:0;font-size:clamp(24px,3vw,34px)}
#customizer .brand-input:focus{
  outline:none;
  box-shadow:none;
  border-bottom-color:#c4523d;
}
#customizer .builder-panel .field-label{font-size:13px;font-weight:600}

#logoCheck[hidden]{display:none}
#customizer .surface-switch{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;background:transparent;padding:0;border-radius:0}
#customizer .surface-switch button{position:relative;display:flex;flex-direction:column;align-items:flex-start;gap:10px;min-width:0;padding:0 0 10px;border:0;border-bottom:2px solid transparent;border-radius:0;background:transparent;color:#55594f;text-align:left;font-size:12px;line-height:1.35;font-weight:500}
#customizer .surface-switch button::before{content:"";display:block;width:100%;height:64px;border:1px solid #292d2426;box-shadow:2px 3px 0 #292d2414;background:#f8f6ef}
#customizer .surface-switch [data-surface="kraft"]::before{background:repeating-linear-gradient(87deg,#84603b0a 0 1px,transparent 1px 4px),linear-gradient(120deg,#d6b588,#bd986a)}
#customizer .surface-switch [data-surface="white"]::before{background:repeating-linear-gradient(0deg,#7e7c7005 0 1px,transparent 1px 3px),linear-gradient(120deg,#fffef9,#e9e6dc)}
#customizer .surface-switch [data-surface="dark"]::before{background:repeating-linear-gradient(93deg,#ffffff06 0 1px,transparent 1px 3px),linear-gradient(120deg,#454740,#252822)}
#customizer .surface-switch button[aria-pressed="true"]{border-bottom-color:#c4523d;color:#20231e;font-weight:650}
#customizer .surface-switch button:hover::before{border-color:#c4523d}
#customizer .surface-switch button:focus-visible{outline:2px solid #a83b29;outline-offset:5px}
@media(max-width:380px){#customizer .surface-switch{gap:8px}}
#previewPrintCursor .roller-model-canvas{pointer-events:none;filter:none;transform:none}
#previewPrintCursor[data-model-ready="loading"] > img{visibility:hidden}

.stamp-unit{display:inline-flex;align-items:center;justify-content:center;gap:.28em;flex-shrink:0;white-space:nowrap}
#previewRepeat .stamp-unit .mask-logo,.stamp-unit .edge-logo,.stamp-unit .request-imprint-logo{display:inline-block;flex:0 0 1.5em;width:1.5em;height:1em;margin:0;mask-size:contain;mask-repeat:no-repeat;mask-position:center}
.request-imprint-band .stamp-unit{max-width:100%;white-space:normal;overflow-wrap:anywhere}

/* Logokat wordmark shares the coral ink of the primary action. */
.site-header .brand img{height:32px;width:auto}
.site-footer .brand img{height:27px;width:auto}
@media(max-width:520px){.site-header .brand img{height:29px}}
