:root { --navy:#0b1633; --navy-2:#13254f; --mint:#35f2b1; --cyan:#38bdf8; --ink:#334155; --muted:#60718c; --white:#f7fafc; --line:#dce5ef; --pale:#edf6fb; --error:#e5484d; --success:#1bba7d; --shadow:0 18px 45px rgba(11,22,51,.1); }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; scroll-padding-top:5rem; }
body { margin:0; color:var(--ink); background:var(--white); font-family:Manrope,Arial,sans-serif; font-size:16px; line-height:1.6; }
button,input,textarea { font:inherit; } button { cursor:pointer; } a { color:inherit; } img { display:block; max-width:100%; }
.container { width:min(1160px,calc(100% - 40px)); margin:0 auto; }
.sr-only { position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; }
.skip-link { position:fixed; z-index:20; top:-4rem; left:1rem; padding:.6rem 1rem; background:var(--mint); color:var(--navy); border-radius:0 0 .5rem .5rem; font-weight:800; transition:top .2s; }.skip-link:focus { top:0; }
.site-header { position:sticky; z-index:10; top:0; background:rgba(247,250,252,.94); backdrop-filter:blur(12px); border-bottom:1px solid rgba(220,229,239,.9); }.nav-wrap,.checkout-header .container { min-height:76px; display:flex; align-items:center; justify-content:space-between; gap:2rem; }.brand { display:block; width:150px; }.brand img,.footer-brand img { width:100%; }
.main-nav { display:flex; align-items:center; gap:1.7rem; font-size:.9rem; font-weight:700; color:#465672; }.main-nav a { text-decoration:none; transition:color .2s; }.main-nav a:hover { color:var(--navy); }.main-nav .nav-support { padding:.55rem 1rem; border:1px solid var(--navy); color:var(--navy); border-radius:.45rem; }.main-nav .nav-support:hover { background:var(--navy); color:white; }.menu-button { display:none; border:0; background:none; font-size:1.5rem; color:var(--navy); }
.hero { overflow:hidden; padding:78px 0 66px; background:linear-gradient(114deg,#f7fafc 0%,#ecf9f7 63%,#edf8fe 100%); }.hero-grid { display:grid; grid-template-columns:1.1fr .9fr; gap:3.5rem; align-items:center; }.eyebrow { margin:0 0 .65rem; color:#148c72; font-family:'DM Mono',monospace; font-size:.72rem; font-weight:500; letter-spacing:.115em; }.hero h1,.section-heading h2,.about-copy h2,.faq-grid h2,.contact-grid h2,.checkout-heading h1 { margin:.1rem 0 1.1rem; color:var(--navy); font-size:clamp(2.25rem,5vw,4.25rem); font-weight:800; letter-spacing:-.055em; line-height:1.08; }.hero-lead { max-width:610px; margin:0; color:#53647e; font-size:1.08rem; }.hero-actions { display:flex; align-items:center; gap:1.25rem; margin-top:2rem; }.button { display:inline-flex; align-items:center; justify-content:center; gap:.7rem; border:0; border-radius:.45rem; padding:.8rem 1.15rem; font-size:.9rem; font-weight:800; line-height:1.2; text-decoration:none; transition:transform .2s,box-shadow .2s,background .2s; }.button:hover { transform:translateY(-2px); }.button-primary { background:var(--mint); color:var(--navy); box-shadow:0 9px 20px rgba(53,242,177,.25); }.button-primary:hover { box-shadow:0 12px 26px rgba(53,242,177,.37); }.button-secondary { background:var(--navy); color:#fff; }.button-outline { color:var(--navy); border:1px solid #b9c7d7; background:transparent; }.button-light { background:#fff; color:var(--navy); border:1px solid #c9d5e0; }.text-link,.text-button { color:#1b94cc; font-weight:800; font-size:.9rem; text-decoration:none; border:0; padding:0; background:transparent; }.text-link:hover,.text-button:hover { text-decoration:underline; }.trust-points { display:flex; flex-wrap:wrap; gap:1.1rem; padding:0; margin:2rem 0 0; list-style:none; color:#4e607a; font-size:.8rem; font-weight:700; }.trust-points span { color:#0d9d70; margin-right:.22rem; }
.hero-art { min-height:400px; position:relative; }.orb { position:absolute; border-radius:50%; filter:blur(1px); }.orb-one { top:25px; right:8%; width:255px; height:255px; background:rgba(56,189,248,.16); }.orb-two { bottom:0; left:1%; width:150px; height:150px; background:rgba(53,242,177,.25); }.game-card { position:absolute; width:270px; height:340px; border-radius:22px; }.game-card-back { top:39px; left:9%; transform:rotate(-11deg); background:linear-gradient(150deg,#1b4071,#173361); box-shadow:0 24px 40px rgba(11,22,51,.22); }.game-card-back span { position:absolute; bottom:28px; right:25px; color:#7fcdf6; font-family:'DM Mono'; letter-spacing:.11em; font-size:.72rem; }.game-card-front { right:11%; top:14px; overflow:hidden; padding:24px; color:#f7fafc; background:radial-gradient(circle at 70% 15%,#244d81 0,#10244b 39%,#0b1633 86%); box-shadow:0 30px 58px rgba(11,22,51,.28); transform:rotate(6deg); }.game-card-front:before { content:''; position:absolute; inset:0; opacity:.24; background:linear-gradient(120deg,transparent 28%,#38bdf8 28.3%,transparent 28.8%),linear-gradient(60deg,transparent 52%,#35f2b1 52.4%,transparent 53%); }.card-top,.card-bottom { position:relative; z-index:1; display:flex; align-items:center; justify-content:space-between; }.tiny-logo { padding:3px 7px; color:var(--navy); background:var(--mint); border-radius:4px; font-weight:800; font-size:.74rem; }.status-dot { width:8px; height:8px; background:var(--mint); border-radius:50%; box-shadow:0 0 0 5px rgba(53,242,177,.15); }.pixel-controller { position:relative; z-index:1; width:165px; height:100px; margin:54px auto 23px; border:6px solid #d8f5fa; border-radius:45px 45px 30px 30px; transform:rotate(-8deg); opacity:.9; }.pixel-controller i,.pixel-controller b,.pixel-controller em { position:absolute; display:block; }.pixel-controller i { top:35px; left:28px; width:28px; height:10px; background:var(--mint); }.pixel-controller i:after { content:''; position:absolute; top:-9px; left:9px; width:10px; height:28px; background:var(--mint); }.pixel-controller b,.pixel-controller em { width:11px; height:11px; border-radius:50%; background:var(--cyan); }.pixel-controller b { right:30px; top:31px; }.pixel-controller em { right:15px; top:46px; background:var(--mint); }.game-card-front p { position:relative; z-index:1; margin:0; font-family:'DM Mono'; letter-spacing:.11em; font-size:1.05rem; line-height:1.25; }.game-card-front p strong { font-family:Manrope; font-size:2rem; letter-spacing:-.07em; }.card-bottom { position:absolute; z-index:1; bottom:20px; left:24px; right:24px; font-family:'DM Mono'; font-size:.55rem; letter-spacing:.08em; }.floating-chip { position:absolute; z-index:3; display:grid; place-items:center; width:52px; height:52px; color:var(--navy); border-radius:13px; background:#f7fafc; box-shadow:var(--shadow); font-size:1.4rem; font-weight:800; }.chip-one { top:15px; left:12%; transform:rotate(-9deg); }.chip-two { bottom:28px; right:2%; background:var(--mint); transform:rotate(8deg); }
.service-strip { background:var(--navy); color:#cbd8e9; }.service-strip-inner { display:flex; justify-content:space-between; gap:1rem; padding:1rem 0; font-size:.76rem; }.service-strip p { margin:0; }.service-strip strong { color:white; }
.section { padding:96px 0; }.section-heading { margin-bottom:2.5rem; }.section-heading h2,.about-copy h2,.faq-grid h2,.contact-grid h2 { font-size:clamp(2rem,3.7vw,3.1rem); }.split-heading { display:flex; justify-content:space-between; align-items:end; gap:2rem; }.split-heading>p { max-width:380px; margin:0 0 .5rem; color:var(--muted); font-size:.92rem; }.centered { max-width:670px; margin:0 auto 3.2rem; text-align:center; }.availability { margin:-.5rem 0 1.25rem; padding:.75rem 1rem; border:1px solid #f0c6c7; border-radius:.5rem; color:#9d2730; background:#fff5f5; font-size:.88rem; }
.product-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:17px; }.product-card { position:relative; overflow:visible; padding:0; border:1px solid #dbe6ef; border-radius:13px; background:#fff; box-shadow:0 7px 22px rgba(11,22,51,.045); transition:transform .2s,box-shadow .2s,border .2s; }.product-card:hover { z-index:1; border-color:#a8decf; box-shadow:var(--shadow); transform:translateY(-4px); }.product-visual { position:relative; height:116px; overflow:hidden; border-radius:12px 12px 0 0; background:radial-gradient(circle at 76% 18%,#38bdf8 0,rgba(56,189,248,.1) 22%,transparent 23%),linear-gradient(125deg,#0b1633,#163b70); }.product-visual:before { content:''; position:absolute; bottom:-58px; right:-34px; width:175px; height:175px; border:20px solid rgba(53,242,177,.8); transform:rotate(45deg); }.product-visual:after { content:'IK'; position:absolute; left:21px; top:27px; color:white; font-size:2.2rem; font-weight:800; letter-spacing:-.12em; }.product-visual span { position:absolute; z-index:1; right:18px; top:17px; color:var(--mint); font-family:'DM Mono'; font-size:.68rem; letter-spacing:.12em; }.product-content { padding:17px 17px 18px; }.product-name { display:flex; align-items:flex-start; gap:.45rem; margin:0; color:var(--navy); font-size:1rem; line-height:1.35; }.product-price { margin:8px 0 15px; color:#526480; font-size:.82rem; }.product-price strong { color:var(--navy); font-size:1.35rem; }.product-actions { display:grid; grid-template-columns:1fr 1fr; gap:8px; }.product-actions .button { padding:.68rem .4rem; font-size:.78rem; }.product-actions .button-outline { background:white; }.info-button { position:relative; display:inline-grid; flex:0 0 auto; place-items:center; width:17px; height:17px; padding:0; color:#53647e; border:1px solid #8fa0b9; border-radius:50%; background:white; font-family:Georgia,serif; font-size:11px; font-weight:700; line-height:1; }.tooltip { position:absolute; z-index:4; left:50%; bottom:calc(100% + 8px); width:255px; padding:.75rem; color:#e5eef7; background:var(--navy); border-radius:.45rem; box-shadow:var(--shadow); font-family:Manrope; font-size:.73rem; font-weight:500; line-height:1.45; opacity:0; pointer-events:none; transform:translate(-50%,4px); transition:.2s; }.tooltip:after { content:''; position:absolute; bottom:-5px; left:50%; width:10px; height:10px; background:var(--navy); transform:translateX(-50%) rotate(45deg); }.info-button:hover .tooltip,.info-button:focus .tooltip { opacity:1; transform:translate(-50%,0); }
.custom-amount { display:flex; align-items:center; gap:1rem; margin-top:18px; padding:18px 20px; border:1px dashed #aebfcc; border-radius:12px; background:#fff; }.custom-amount>div:nth-child(2) { display:grid; flex:1; }.custom-amount strong { color:var(--navy); font-size:.94rem; }.custom-amount span { color:var(--muted); font-size:.78rem; }.custom-icon { display:grid; place-items:center; width:43px; height:43px; color:var(--navy); border-radius:10px; background:#d7fbec; font-size:1.2rem; font-weight:800; }.amount-input { display:flex; align-items:center; width:155px; padding:0 .65rem; border:1px solid #cbd8e5; border-radius:.4rem; color:#5d6f86; background:#fff; }.amount-input input { width:100%; min-width:0; padding:.66rem .35rem; border:0; outline:0; color:var(--navy); font-weight:700; }.amount-input:focus-within { border-color:var(--cyan); box-shadow:0 0 0 3px rgba(56,189,248,.12); }
.how-section { background:#eaf5fb; }.steps { display:grid; grid-template-columns:repeat(4,1fr); gap:1.3rem; }.steps article { position:relative; padding:1.15rem; min-height:235px; background:#f9fcff; border:1px solid #d8e8f1; border-radius:12px; }.step-number { position:absolute; right:14px; top:13px; color:#9aafbd; font-family:'DM Mono'; font-size:.7rem; }.step-icon { display:grid; place-items:center; width:47px; height:47px; margin-bottom:1.55rem; color:var(--navy); border-radius:11px; background:var(--mint); font-family:'DM Mono'; font-weight:800; }.steps h3 { margin:0 0 .45rem; color:var(--navy); font-size:1rem; }.steps p { margin:0; color:#617189; font-size:.82rem; line-height:1.55; }
.about-section { background:var(--navy); color:#c3d0df; }.about-grid { display:grid; grid-template-columns:.9fr 1fr; gap:7rem; align-items:center; }.about-copy h2 { color:white; }.about-copy>p:not(.eyebrow) { margin:.72rem 0; max-width:560px; font-size:.93rem; }.about-copy .disclaimer { margin-top:1.3rem; padding:.9rem 1rem; border-left:2px solid var(--mint); color:#d5e2ef; background:rgba(255,255,255,.04); font-size:.78rem; }.about-visual { position:relative; min-height:330px; overflow:hidden; border-radius:16px; background:linear-gradient(145deg,#152c58,#0c1935); }.about-grid-lines { position:absolute; inset:0; opacity:.18; background-image:linear-gradient(#56c9f9 1px,transparent 1px),linear-gradient(90deg,#56c9f9 1px,transparent 1px); background-size:30px 30px; }.about-keyhole { position:absolute; z-index:2; top:84px; left:95px; width:85px; height:129px; background:#f7fafc; border-radius:44px 44px 12px 12px; transform:rotate(-8deg); }.about-keyhole:before { content:''; position:absolute; top:27px; left:20px; width:45px; height:45px; border-radius:50%; background:var(--navy); }.about-keyhole span { position:absolute; z-index:1; top:62px; left:34px; width:18px; height:47px; background:var(--navy); }.about-letter { position:absolute; z-index:1; top:40px; right:82px; color:var(--mint); font-size:12rem; font-weight:800; line-height:1; letter-spacing:-.2em; }.about-line { position:absolute; height:8px; background:var(--cyan); transform:rotate(-8deg); }.about-line-a { width:140px; left:56px; bottom:65px; }.about-line-b { width:70px; right:42px; top:82px; background:var(--mint); }
.faq-section { background:#fff; }.faq-grid { display:grid; grid-template-columns:.83fr 1.17fr; gap:5rem; }.faq-grid>div:first-child>p:not(.eyebrow) { max-width:340px; margin:0 0 1.5rem; color:var(--muted); font-size:.9rem; }.faq-list { border-top:1px solid var(--line); }.faq-list details { border-bottom:1px solid var(--line); }.faq-list summary { display:flex; justify-content:space-between; gap:1rem; padding:1.08rem 0; color:var(--navy); cursor:pointer; font-size:.94rem; font-weight:800; list-style:none; }.faq-list summary::-webkit-details-marker { display:none; }.faq-list summary span { color:var(--cyan); font-size:1.3rem; font-weight:400; transition:transform .2s; }.faq-list details[open] summary span { transform:rotate(45deg); }.faq-list p { max-width:600px; margin:0 0 1.1rem; color:#60718a; font-size:.86rem; }
.contact-section { padding:88px 0; color:#d3dfeb; background:#10214a; }.contact-grid { display:grid; grid-template-columns:.85fr 1.15fr; gap:6rem; align-items:start; }.contact-grid h2 { color:white; }.contact-grid>div>p:not(.eyebrow) { max-width:370px; color:#bfcdde; font-size:.92rem; }.contact-note { display:flex; gap:.8rem; max-width:405px; margin-top:1.8rem; padding:1rem; border:1px solid rgba(127,190,220,.25); border-radius:.5rem; background:rgba(255,255,255,.04); }.contact-note span { color:var(--mint); font-size:1.2rem; }.contact-note p { margin:0; color:#ccdae8; font-size:.77rem; line-height:1.55; }.contact-form { display:grid; gap:1rem; padding:1.5rem; border-radius:12px; background:#f7fafc; color:var(--ink); box-shadow:0 20px 38px rgba(0,0,0,.14); }.contact-form label,.checkout-form label { display:grid; gap:.37rem; color:#42546e; font-size:.78rem; font-weight:800; }.contact-form input,.contact-form textarea,.checkout-form input { width:100%; padding:.75rem .8rem; border:1px solid #c9d6e2; border-radius:.4rem; outline:none; color:var(--navy); background:#fff; font-size:.9rem; font-weight:500; transition:border .15s,box-shadow .15s; }.contact-form textarea { min-height:110px; resize:vertical; }.contact-form input:focus,.contact-form textarea:focus,.checkout-form input:focus { border-color:var(--cyan); box-shadow:0 0 0 3px rgba(56,189,248,.13); }.form-message { min-height:1.35em; margin:0; font-size:.8rem; font-weight:700; }.form-message.error { color:var(--error); }.form-message.success { color:#147a5a; }
.site-footer { color:#c1d0df; background:#081126; }.footer-top { display:flex; justify-content:space-between; gap:5rem; padding:52px 0 35px; }.footer-brand { display:block; width:145px; padding:9px 10px; border-radius:.4rem; background:#f7fafc; }.footer-top>div:first-child>p { margin:1rem 0 0; color:#8fa3bb; font-size:.8rem; }.footer-links { display:flex; gap:4.5rem; }.footer-links div { display:grid; align-content:start; gap:.4rem; }.footer-links h3 { margin:0 0 .35rem; color:#f2f7fb; font-size:.82rem; }.footer-links a { color:#aebfd0; font-size:.76rem; text-decoration:none; }.footer-links a:hover { color:var(--mint); }.business-info { display:flex; justify-content:space-between; align-items:center; gap:2rem; padding:18px 0; border-top:1px solid rgba(206,224,238,.12); border-bottom:1px solid rgba(206,224,238,.12); }.business-info p { margin:0; color:#95a9c0; font-size:.7rem; line-height:1.5; }.business-info strong { color:#dce9f3; font-size:.74rem; }.cookie-settings { border:0; padding:0; color:var(--mint); background:none; font-size:.75rem; font-weight:800; text-decoration:underline; }.footer-bottom { display:flex; justify-content:space-between; padding:16px 0; color:#8499b2; font-size:.69rem; }
.cookie-banner { position:fixed; z-index:30; right:22px; bottom:22px; width:min(540px,calc(100% - 30px)); padding:1.45rem; border:1px solid #cddbe5; border-radius:12px; color:#50617a; background:#fff; box-shadow:0 18px 55px rgba(11,22,51,.23); }.cookie-banner h2,.modal-card h2 { margin:.1rem 0 .55rem; color:var(--navy); font-size:1.45rem; letter-spacing:-.04em; }.cookie-banner p:not(.eyebrow) { margin:.45rem 0; font-size:.78rem; line-height:1.55; }.cookie-actions { display:flex; align-items:center; flex-wrap:wrap; gap:.65rem; margin-top:1rem; }.cookie-actions .button { padding:.62rem .85rem; font-size:.77rem; }.modal { position:fixed; z-index:40; inset:0; display:none; place-items:center; padding:20px; background:rgba(7,16,37,.62); }.modal.visible { display:grid; }.modal-card { position:relative; width:min(500px,100%); padding:1.8rem; border-radius:12px; background:#fff; box-shadow:var(--shadow); }.close-modal { position:absolute; top:12px; right:14px; width:30px; height:30px; padding:0; border:0; color:#4b5c73; background:transparent; font-size:1.7rem; }.modal-card>p:not(.eyebrow) { color:#62738a; font-size:.83rem; }.toggle-row { display:flex; justify-content:space-between; gap:1rem; align-items:center; padding:1rem 0; border-top:1px solid var(--line); cursor:pointer; }.toggle-row span { display:grid; gap:.1rem; }.toggle-row strong { color:var(--navy); font-size:.86rem; }.toggle-row small { color:#65768d; font-size:.73rem; }.toggle-row input { position:absolute; opacity:0; }.toggle-row i { position:relative; width:40px; height:22px; border-radius:20px; background:#c0ccda; transition:.2s; }.toggle-row i:after { content:''; position:absolute; top:3px; left:3px; width:16px; height:16px; border-radius:50%; background:#fff; transition:.2s; }.toggle-row input:checked+i { background:var(--mint); }.toggle-row input:checked+i:after { transform:translateX(18px); }.modal-card .button { width:100%; margin-top:1.2rem; }
/* checkout and status */
.checkout-page { background:#f1f6fa; }.checkout-header { background:#fff; border-bottom:1px solid var(--line); }.checkout-header .container { min-height:70px; }.secure-label { display:flex; align-items:center; gap:.4rem; color:#4e6079; font-size:.78rem; font-weight:800; }.checkout-main { padding:35px 0 65px; }.back-link { color:#50617a; font-size:.82rem; font-weight:800; text-decoration:none; }.back-link:hover { color:var(--navy); }.back-link.compact { margin-left:auto; }.checkout-heading { margin:1.9rem 0 2rem; }.checkout-heading h1 { margin-bottom:.35rem; font-size:clamp(2rem,4vw,3rem); }.checkout-heading>p:last-child { margin:0; color:#64758c; font-size:.9rem; }.checkout-alert { margin:0 0 1.2rem; padding:.85rem 1rem; border:1px solid #f0c6c7; border-radius:.5rem; color:#a12b35; background:#fff5f5; font-size:.86rem; }.checkout-layout { display:grid; grid-template-columns:minmax(0,1fr) 360px; gap:24px; align-items:start; }.checkout-form,.order-summary { border:1px solid #d8e3ed; border-radius:11px; background:#fff; box-shadow:0 8px 25px rgba(11,22,51,.045); }.checkout-section { padding:1.6rem; border-bottom:1px solid var(--line); }.checkout-section:last-child { border-bottom:0; }.section-title { display:flex; gap:.8rem; margin-bottom:1.3rem; }.section-title>span { display:grid; flex:0 0 28px; place-items:center; width:28px; height:28px; color:var(--navy); border-radius:50%; background:var(--mint); font-size:.75rem; font-weight:800; }.section-title h2 { margin:0; color:var(--navy); font-size:1.05rem; }.section-title p { margin:.12rem 0 0; color:#667890; font-size:.76rem; line-height:1.45; }.field-grid { display:grid; grid-template-columns:1fr 1fr; gap:.9rem; }.checkout-form label { margin-bottom:.95rem; }.checkout-form label:last-child { margin-bottom:0; }.half-field { width:calc(50% - .45rem); }.security-tip { display:flex; gap:.6rem; margin-top:.95rem; padding:.8rem .9rem; border:1px solid #c9e8fa; border-radius:.45rem; color:#486579; background:#f2fbff; }.security-tip b { display:grid; flex:0 0 auto; place-items:center; width:17px; height:17px; margin-top:2px; color:white; border-radius:50%; background:#2598cd; font-family:Georgia; font-size:.72rem; }.security-tip p { margin:0; font-size:.74rem; line-height:1.5; }.security-tip strong { color:var(--navy); }.checkbox-row { display:flex!important; grid-template-columns:none!important; align-items:flex-start; gap:.7rem; cursor:pointer; }.checkbox-row input { position:absolute; width:1px!important; height:1px; opacity:0; }.checkbox-row>span { position:relative; flex:0 0 19px; width:19px; height:19px; margin-top:2px; border:1px solid #9cadc0; border-radius:4px; background:white; }.checkbox-row input:checked+span { border-color:#15966d; background:var(--mint); }.checkbox-row input:checked+span:after { content:'✓'; position:absolute; left:3px; top:-1px; color:var(--navy); font-size:.85rem; }.checkbox-row p { margin:0; color:#5d6e86; font-size:.78rem; font-weight:500; line-height:1.48; }.checkbox-row a { color:#168dc4; }.checkout-message { margin:.8rem 0 0; }.order-summary { position:sticky; top:90px; padding:1.35rem; }.summary-product { display:flex; gap:.8rem; padding-bottom:1.2rem; border-bottom:1px solid var(--line); }.summary-art { position:relative; display:grid; flex:0 0 58px; place-items:center; width:58px; height:58px; overflow:hidden; color:#fff; border-radius:8px; background:linear-gradient(135deg,#0b1633,#235d91); font-size:1.5rem; font-weight:800; }.summary-art i { position:absolute; right:-6px; bottom:-11px; width:31px; height:31px; border:6px solid var(--mint); transform:rotate(45deg); }.summary-product h2 { display:flex; align-items:flex-start; gap:.35rem; margin:0; color:var(--navy); font-size:.9rem; line-height:1.25; }.summary-product p { margin:.35rem 0 0; color:#6c7c91; font-size:.74rem; }.summary-line,.summary-total { display:flex; justify-content:space-between; align-items:center; padding:1rem 0; color:#5c6d84; font-size:.83rem; }.summary-line { border-bottom:1px solid var(--line); }.summary-line strong { color:var(--navy); }.summary-total { padding-top:1.15rem; color:var(--navy); font-size:.88rem; font-weight:800; }.summary-total strong { font-size:1.3rem; }.button-full { width:100%; }.summary-fineprint { margin:1rem 0 0; color:#77879b; font-size:.67rem; line-height:1.5; text-align:center; }.checkout-footer { padding:20px 0; border-top:1px solid var(--line); color:#63748a; background:#fff; font-size:.72rem; }.checkout-footer .container { display:flex; justify-content:space-between; gap:1rem; }.checkout-footer a { color:#167fb5; text-decoration:none; font-weight:800; }
.status-page { display:flex; flex-direction:column; min-height:100vh; background:linear-gradient(135deg,#edf7fb,#f7fafc); }.status-main { display:grid; flex:1; place-items:center; padding:4rem 0; }.status-card { max-width:670px; padding:3rem; color:#61728a; border:1px solid #d4e1ec; border-radius:16px; background:#fff; box-shadow:var(--shadow); text-align:center; }.status-card h1 { margin:.2rem 0 .85rem; color:var(--navy); font-size:clamp(1.9rem,4vw,2.8rem); letter-spacing:-.05em; line-height:1.15; }.status-card>p:not(.eyebrow) { max-width:540px; margin:.2rem auto 1.4rem; font-size:.91rem; }.status-symbol { display:grid; place-items:center; width:62px; height:62px; margin:0 auto 1.3rem; border-radius:50%; font-size:1.6rem; font-weight:800; }.status-processing { color:#0d779f; background:#dff5ff; }.status-delivered { color:#117550; background:#d9f9ec; }.status-failed { color:#bd3440; background:#ffebec; }.status-actions { display:flex; justify-content:center; flex-wrap:wrap; gap:.75rem; margin-top:1.6rem; }
/* legal */
.legal-page { background:#f7fafc; }.legal-header { background:var(--navy); }.legal-header .container { min-height:74px; display:flex; align-items:center; justify-content:space-between; }.legal-header .brand { padding:7px 9px; border-radius:.3rem; background:#f7fafc; }.legal-header a:not(.brand) { color:#d2e2ee; font-size:.8rem; font-weight:800; text-decoration:none; }.legal-main { display:grid; grid-template-columns:205px minmax(0,1fr); gap:4rem; padding:52px 0 80px; }.legal-nav { align-self:start; position:sticky; top:95px; display:grid; gap:.25rem; padding:.75rem; border:1px solid var(--line); border-radius:9px; background:#fff; }.legal-nav a { padding:.52rem .65rem; border-radius:.35rem; color:#5e7088; font-size:.76rem; font-weight:700; text-decoration:none; }.legal-nav a:hover,.legal-nav a.active { color:var(--navy); background:#dff8ef; }.legal-content { padding:clamp(1.4rem,4vw,3.25rem); border:1px solid var(--line); border-radius:12px; background:#fff; box-shadow:0 5px 20px rgba(11,22,51,.035); }.legal-content h1 { margin:0 0 .35rem; color:var(--navy); font-size:clamp(2rem,4vw,3rem); letter-spacing:-.055em; }.legal-content .updated { margin:0 0 2rem; color:#62748d; font-size:.78rem; }.legal-content h2 { margin:2rem 0 .7rem; color:var(--navy); font-size:1.15rem; }.legal-content h3 { margin:1.4rem 0 .55rem; color:var(--navy); font-size:.98rem; }.legal-content p,.legal-content li { color:#52647d; font-size:.84rem; }.legal-content p { margin:.5rem 0; }.legal-content ul { padding-left:1.25rem; }.legal-content li { margin:.25rem 0; }.legal-content table { width:100%; margin:1rem 0; border-collapse:collapse; font-size:.76rem; }.legal-content th,.legal-content td { padding:.65rem; border:1px solid var(--line); color:#53647a; text-align:left; vertical-align:top; }.legal-content th { color:var(--navy); background:#eef6fb; }.legal-footer { color:#aebfd0; background:#081126; }.legal-footer .container { display:flex; justify-content:space-between; gap:1rem; padding:20px 0; font-size:.72rem; }
button.button:disabled { cursor:not-allowed; opacity:.5; transform:none; box-shadow:none; }
@media (max-width:900px) { .hero-grid,.about-grid,.faq-grid,.contact-grid { grid-template-columns:1fr; gap:3rem; }.hero-art { max-width:460px; width:100%; min-height:340px; margin:auto; order:-1; }.hero { padding-top:50px; }.product-grid { grid-template-columns:repeat(2,1fr); }.steps { grid-template-columns:repeat(2,1fr); }.about-visual { min-height:280px; }.faq-grid>div:first-child>p:not(.eyebrow) { max-width:540px; }.checkout-layout { grid-template-columns:1fr; }.order-summary { position:static; grid-row:1; }.legal-main { grid-template-columns:1fr; gap:1.5rem; }.legal-nav { position:static; grid-template-columns:repeat(3,1fr); } }
@media (max-width:680px) { .container { width:min(100% - 28px,1160px); }.nav-wrap { min-height:64px; }.brand { width:128px; }.menu-button { display:block; }.main-nav { position:absolute; top:64px; right:14px; left:14px; display:none; align-items:stretch; gap:0; padding:.65rem; border:1px solid var(--line); border-radius:.6rem; background:#fff; box-shadow:var(--shadow); }.main-nav.open { display:grid; }.main-nav a { padding:.7rem; }.main-nav .nav-support { margin:.3rem; text-align:center; }.hero-grid { gap:1rem; }.hero-art { min-height:375px; transform:scale(.78); transform-origin:center top; margin-bottom:0; }.hero h1 { font-size:2.5rem; }.hero-actions { align-items:flex-start; flex-direction:column; }.service-strip-inner,.footer-bottom,.checkout-footer .container { align-items:flex-start; flex-direction:column; }.split-heading { align-items:flex-start; flex-direction:column; gap:.35rem; }.product-grid { grid-template-columns:1fr; }.product-visual { height:100px; }.custom-amount { align-items:stretch; flex-wrap:wrap; }.custom-amount>div:nth-child(2) { min-width:calc(100% - 60px); }.amount-input { flex:1; width:auto; }.custom-amount .button { width:100%; }.steps { grid-template-columns:1fr; }.steps article { min-height:0; }.about-grid,.faq-grid,.contact-grid { gap:2rem; }.about-letter { right:55px; font-size:9rem; }.about-keyhole { top:70px; left:60px; transform:scale(.8) rotate(-8deg); transform-origin:top left; }.footer-top,.business-info { align-items:flex-start; flex-direction:column; gap:2rem; }.footer-links { gap:2rem; }.cookie-banner { right:14px; bottom:14px; }.field-grid { grid-template-columns:1fr; gap:0; }.half-field { width:100%; }.checkout-section { padding:1.15rem; }.checkout-main { padding-top:24px; }.legal-main { padding:25px 0 50px; }.legal-nav { grid-template-columns:1fr 1fr; }.legal-content { padding:1.3rem; }.status-card { padding:2rem 1.25rem; }.status-main { padding:2rem 0; } }