@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@400;500;700;800;900&display=swap');
:root { color-scheme: light; --bg:#ffffff; --panel:#ffffff; --line:#d7dce3; --text:#000000; --muted:#000000; --accent:#142B45; --accent-dark:#142B45; --white:#ffffff; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
::selection { color:#fff; background:var(--accent); }
*:focus-visible { outline:3px solid rgba(20,43,69,.55); outline-offset:4px; }
body { position:relative; isolation:isolate; margin:0; min-height:100vh; background:var(--bg); color:var(--text); font:16px/1.6 "Montserrat", Inter,ui-sans-serif,system-ui,-apple-system,Segoe UI,sans-serif; animation:pageIn .75s ease both; }
body:before { content:""; display:block; position:fixed; z-index:-1; top:8%; left:-120px; width:280px; height:280px; border:1px solid rgba(0,169,160,.12); border-radius:50%; box-shadow:110px 80px 0 -1px rgba(0,169,160,.04); animation:ambientDrift 18s ease-in-out infinite alternate; pointer-events:none; }
body:before { display:none; }
.scroll-progress { display:none; }
a { color:inherit; }
.skip-link { position:absolute; left:16px; top:-60px; z-index:20; padding:10px 14px; border-radius:0 0 10px 10px; background:var(--accent-dark); color:#fff; font-weight:700; text-decoration:none; transition:top .2s ease; }
.skip-link:focus { top:0; }
.wrap { width:min(1060px,calc(100% - 40px)); margin:auto; }
header { display:flex; justify-content:space-between; align-items:center; gap:28px; padding:18px 0 14px; border-bottom:1px solid #e5e7eb; }
.site-brand { display:grid; grid-template-columns:auto auto auto; grid-template-rows:auto auto; align-items:center; column-gap:2px; color:var(--text); text-decoration:none; font-weight:900; letter-spacing:-.08em; line-height:.85; }
.site-brand-logo { grid-row:1 / 3; width:68px; height:38px; margin-right:7px; object-fit:contain; object-position:center; }
.site-brand span { font-size:1.35rem; }
.site-brand b { color:var(--accent); font-size:1.35rem; }
.site-brand small { grid-column:2 / -1; margin-top:7px; color:var(--muted); font-size:.48rem; font-weight:700; letter-spacing:.18em; }
.mark { display:none; }
.brand { display:flex; align-items:center; gap:18px; }
.brand-icon { position:relative; width:76px; height:60px; flex-shrink:0; }
.brand-icon .screen { position:absolute; left:0; right:0; top:0; height:42px; border-radius:12px; border:6px solid var(--accent); background:var(--white); box-shadow:inset 0 0 0 2px rgba(20,43,69,.06); }
.brand-icon .screen:before { content:""; position:absolute; left:12px; right:12px; top:14px; bottom:10px; border-radius:6px; background:var(--white); }
.brand-icon .screen:after { content:""; position:absolute; left:50%; top:50%; width:18px; height:18px; border-radius:50%; background:var(--white); transform:translate(-50%,-50%); box-shadow: 0 0 0 4px rgba(20,43,69,.06); }
.brand-icon .cursor { position:absolute; width:18px; height:18px; background:var(--accent-dark); clip-path:polygon(0 0, 100% 38%, 68% 42%, 88% 100%, 70% 100%, 49% 55%, 18% 100%); right:8px; top:6px; transform:rotate(20deg); }
.brand-icon .stand { position:absolute; left:29px; bottom:0; width:18px; height:12px; border-radius:10px; background:var(--accent); }
.brand-icon .stand:before { content:""; position:absolute; left:50%; top:10px; transform:translateX(-50%); width:42px; height:8px; border-radius:0 0 10px 10px; background:var(--accent); }
.brand-wordmark { display:flex; flex-direction:column; line-height:0.96; font-weight:800; letter-spacing:-.06em; }
.brand-wordmark .solv { color:var(--text); font-size:clamp(1.6rem,2vw,2.4rem); }
.brand-wordmark .it { color:var(--accent); font-size:clamp(1.6rem,2vw,2.4rem); }
.brand-wordmark .services { margin-top:2px; font-size:clamp(.6rem,1vw,.9rem); letter-spacing:.08em; text-transform:uppercase; color:var(--text); }
.brand-wordmark .tagline { margin-top:6px; font-size:clamp(.7rem,.9vw,.9rem); font-weight:400; letter-spacing:-.02em; color:var(--muted); }
.build { color:var(--muted); font:11px/1 monospace; letter-spacing:.12em; }
nav { display:flex; gap:6px; color:var(--muted); font-size:14px; align-items:center; justify-content:flex-end; }
nav a { position:relative; padding:8px 12px; border:1px solid transparent; border-radius:14px; text-decoration:none; transition:color .2s ease,background-color .2s ease,transform .2s ease,border-color .2s ease,box-shadow .2s ease; }
nav a:hover { color:var(--text); background:#f1f3f6; transform:translateY(-1px); }
nav a.active { color:#000; background:#fff; border-color:var(--line); box-shadow:0 2px 4px rgba(20,43,69,.08),0 8px 18px rgba(20,43,69,.08); }
main { padding:40px 0 56px; }
.eyebrow { color:var(--text); font:12px monospace; letter-spacing:.18em; text-transform:uppercase; }
.home-intro > .eyebrow { margin-top:44px; }
.home-intro .actions { margin-top:48px; }
.trust-list { display:flex; justify-content:center; gap:12px 26px; flex-wrap:wrap; margin:24px auto 0; color:var(--muted); font-size:.78rem; }
.trust-list b { margin-right:5px; color:var(--accent); }
.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; }
h1 { max-width:760px; margin:14px 0 20px; font-size:clamp(2rem,4vw,3rem); font-weight:500; line-height:1.2; letter-spacing:-.04em; }
h2 { margin:0 0 10px; font-size:clamp(1.8rem,4vw,3rem); letter-spacing:-.04em; }
.intro { max-width:650px; margin:12px auto 0; color:var(--muted); font-size:clamp(1rem,1.6vw,1.15rem); }
.muted { color:var(--muted); }
.hero { display:grid; grid-template-columns:minmax(0,1fr); gap:0; align-items:center; }
.hero-panel { grid-column:1; width:100%; max-width:900px; margin:0 auto; padding:clamp(12px,2vw,22px); border:1px solid var(--line); border-radius:14px; background:var(--panel); box-shadow:0 2px 4px rgba(20,43,69,.08),0 8px 18px rgba(20,43,69,.08); }
.home-intro { width:100%; margin:0 auto; padding:clamp(24px,5vw,52px) clamp(18px,5vw,56px) clamp(28px,5vw,48px); color:#000; text-align:center; }
.home-intro .eyebrow,.home-intro .intro,.home-intro .owner-contact h2,.home-intro .contact-links span,.home-intro .contact-links a,.home-intro .trust-list { color:#000; }
.home-intro .contact-icon { stroke:#000; }
.home-intro .trust-list b { color:#000; }
.hero-logo-frame { width:min(100%,680px); height:clamp(150px,24vw,250px); margin:0 auto; overflow:hidden; background:#fff; }
.hero-logo { display:block; width:100%; height:100%; object-fit:contain; object-position:center; filter:drop-shadow(0 12px 20px rgba(20,43,69,.08)); animation:logoBreathe 6s ease-in-out infinite; }
.owner-contact { max-width:620px; margin:0 auto 54px; text-align:center; }
.owner-contact h2 { margin:0 0 24px; color:var(--text); font-size:clamp(1.35rem,3vw,1.8rem); letter-spacing:-.04em; }
.contact-links { display:flex; justify-content:center; gap:12px 30px; flex-wrap:wrap; margin:0; padding:0; list-style:none; }
.contact-links li { display:grid; gap:2px; }
.contact-links span { color:var(--muted); font-size:.75rem; font-weight:700; letter-spacing:.08em; text-transform:uppercase; }
.contact-links a { display:inline-flex; align-items:center; justify-content:center; gap:7px; color:var(--text); text-decoration-color:var(--accent); text-underline-offset:4px; }
.contact-icon { width:16px; height:16px; flex:none; fill:none; stroke:var(--accent); stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; }
.contact-links a:hover { color:var(--text); }
.home-intro .contact-links a:hover { color:#000; }
.hero-art { display:none; }
.hero-art:before { content:""; position:absolute; width:180px; height:180px; border:1px solid #8fb898; border-radius:50%; opacity:.55; }
.hero-art:after { content:""; position:absolute; width:310px; height:310px; border:1px dashed #8fb898; border-radius:50%; opacity:.45; animation:orbit 18s linear infinite; }
.plant { position:relative; z-index:1; width:120px; height:170px; transform:rotate(-3deg); }
.stem { position:absolute; left:57px; top:18px; width:5px; height:145px; border-radius:8px; background:var(--accent); transform:rotate(7deg); transform-origin:bottom; animation:sway 4s ease-in-out infinite; }
.leaf { position:absolute; width:58px; height:30px; border-radius:100% 0 100% 0; background:#73a879; }
.leaf.one { left:4px; top:69px; transform:rotate(18deg); } .leaf.two { right:1px; top:48px; transform:rotate(72deg); background:#4f8b5c; } .leaf.three { left:19px; top:25px; transform:rotate(-28deg); background:#9cc78f; } .leaf.four { right:0; top:97px; transform:rotate(42deg); background:#88b786; }
.hero-note { position:absolute; bottom:18px; right:22px; z-index:2; color:var(--accent); font:10px monospace; letter-spacing:.13em; transform:rotate(-3deg); }
.actions { display:flex; justify-content:center; gap:12px; flex-wrap:wrap; margin-top:26px; }
.button { position:relative; overflow:hidden; display:inline-flex; align-items:center; gap:8px; padding:12px 18px; border:1px solid var(--line); border-radius:14px; color:#000; background:#fff; text-decoration:none; font-weight:700; box-shadow:0 2px 4px rgba(20,43,69,.08),0 8px 18px rgba(20,43,69,.08); transition:transform .2s ease,box-shadow .2s ease; }
.button:after { content:""; position:absolute; inset:0; background:linear-gradient(110deg,transparent 35%,#ffffff55 50%,transparent 65%); transform:translateX(-120%); transition:transform .5s ease; }
.button:hover { transform:translateY(-2px); border-color:var(--accent); box-shadow:0 4px 8px rgba(20,43,69,.1),0 12px 24px rgba(20,43,69,.12); } .button:hover:after { transform:translateX(120%); }
.button.secondary { background:#fff; color:#000; border-color:var(--line); box-shadow:0 2px 4px rgba(20,43,69,.08),0 8px 18px rgba(20,43,69,.08); }
.services-preview { margin-top:-24px; padding:0 0 10px; }
.section-logo { display:block; width:min(100%,500px); aspect-ratio:2 / 1; margin:0 auto 8px; object-fit:contain; filter:drop-shadow(0 10px 16px rgba(20,43,69,.08)); }
.section-heading { margin-bottom:18px; text-align:center; }
.section-heading h2 { margin:8px 0 0; font-size:clamp(1.4rem,3vw,2rem); font-weight:500; letter-spacing:-.04em; }
.feature-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:18px; margin-top:0; }
.feature { min-height:190px; padding:24px; border:1px solid var(--line); border-radius:14px; background:var(--panel); color:#000; text-decoration:none; box-shadow:0 2px 4px rgba(20,43,69,.08),0 8px 18px rgba(20,43,69,.08); transition:transform .2s ease,border-color .2s ease,box-shadow .2s ease; }
.feature .muted { color:#000; }
.feature:nth-child(2) { animation-delay:.12s; } .feature:nth-child(3) { animation-delay:.24s; }
.feature:hover { transform:translateY(-3px); border-color:var(--accent); box-shadow:0 4px 8px rgba(20,43,69,.1),0 12px 24px rgba(20,43,69,.12); }
.feature h3:after { content:' ↗'; color:#000; font-size:.9em; opacity:0; transform:translateX(-4px); display:inline-block; transition:opacity .2s ease,transform .2s ease; }
.feature:hover h3:after { opacity:1; transform:translateX(2px); }
.feature-number { color:#000; font:12px monospace; }
.feature h3 { margin:24px 0 7px; font-size:1.05rem; }
.feature p { margin:0; line-height:1.65; }
.section-cta { margin-top:24px; text-align:center; }
.process-strip { max-width:900px; margin:54px auto 0; padding:34px 0 8px; border-top:1px solid var(--line); }
.process-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:18px; }
.process-step { padding:22px; border:1px solid var(--line); border-radius:14px; background:rgba(255,255,255,.72); box-shadow:0 2px 4px rgba(20,43,69,.06),0 8px 18px rgba(20,43,69,.05); }
.process-step > span { color:var(--accent); font:12px monospace; letter-spacing:.08em; }
.process-step h3 { margin:22px 0 8px; font-size:1.02rem; }
.process-step p { margin:0; color:var(--muted); font-size:.9rem; line-height:1.6; }
.service-flip[id] { scroll-margin-top:24px; }
.text-link { color:var(--text); font-weight:700; text-underline-offset:5px; text-decoration-color:var(--text); }
.text-link span { color:var(--text); display:inline-block; margin-left:4px; transition:transform .2s ease; }
.text-link:hover span { transform:translateX(4px); }
.page-intro { max-width:720px; margin:0 auto 45px; text-align:center; }
.content-card { max-width:720px; margin:0 auto; padding:30px; border:1px solid var(--line); border-radius:14px; background:var(--panel); color:#000; text-align:center; box-shadow:0 2px 4px rgba(20,43,69,.08),0 8px 18px rgba(20,43,69,.08); }
.content-card .muted,.content-card .form-note { color:#000; }
.content-card { }
.tools-list { width:100%; max-width:720px; margin:0 auto; }
.tool-card { min-width:0; color:#000; }
.tool-card p { margin:0 0 18px; }
.tool-card label { display:block; margin:12px 0 6px; font-size:.9rem; font-weight:700; }
.tool-card input[type="text"],.tool-card input[type="number"],.tool-card input[type="password"],.tool-card textarea,.tool-card select { width:100%; padding:11px 12px; border:1px solid var(--line); border-radius:10px; background:#fff; color:#000; font:inherit; }
.tool-card textarea { min-height:130px; resize:vertical; }
.tool-card form,.tool-card label { text-align:left; }
.tool-card textarea:read-only { background:#f6f7f9; }
.tool-card input[type="number"] { max-width:180px; }
.tool-output { margin:14px 0 0; padding:12px 14px; border-radius:10px; background:#f6f7f9; color:#000; font-size:.9rem; }
.tool-output p { margin:4px 0; }
.tool-output[hidden] { display:none; }
.tool-output > div { display:grid; grid-template-columns:minmax(130px,1fr) 2fr; gap:10px; padding:4px 0; }
.tool-output dt { font-weight:700; }
.tool-output dd { margin:0; overflow-wrap:anywhere; }
.tool-options { display:flex; gap:8px 16px; flex-wrap:wrap; margin:10px 0 14px; }
.tool-options label { display:inline-flex; align-items:center; gap:7px; margin:0; font-weight:400; }
.tool-options input { accent-color:var(--accent); }
.tool-result { min-height:1.6em; margin:12px 0 0 !important; font-size:.9rem; overflow-wrap:anywhere; }
.tool-card .actions { justify-content:flex-start; margin-top:14px; }
.tool-card .button { cursor:pointer; font:700 .95rem "Montserrat",Inter,ui-sans-serif,system-ui,sans-serif; }
.tool-card .button:disabled { cursor:not-allowed; opacity:.65; }
.ping-results { display:grid; gap:4px; margin:10px 0 0; padding-left:22px; font-size:.9rem; }
.tool-note { margin-top:16px !important; color:#000; font-size:.82rem; }
.tool-answer { padding-top:2px; }
.js .reveal { opacity:0; transform:translateY(22px); transition:opacity .7s ease var(--reveal-delay),transform .7s cubic-bezier(.2,.7,.2,1) var(--reveal-delay); }
.js .reveal.is-visible { opacity:1; transform:none; }
.spaced-card { margin:20px auto 0; }
.contact-direct { display:flex; justify-content:center; align-items:center; gap:24px; max-width:720px; margin:20px auto 0; padding:24px 28px; border:1px solid var(--line); border-radius:14px; background:var(--panel); color:#000; text-align:center; box-shadow:0 2px 4px rgba(20,43,69,.08),0 8px 18px rgba(20,43,69,.08); }
.contact-direct .muted,.contact-direct .eyebrow { color:#000; }
.contact-direct h2 { margin:6px 0 4px; font-size:clamp(1.25rem,3vw,1.7rem); }
.contact-direct p { margin:0; font-size:.9rem; }
.direct-actions { display:flex; gap:10px; flex-wrap:wrap; justify-content:center; }
.direct-actions .button { white-space:nowrap; }
.price-list { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px; max-width:900px; margin:0 auto; }
.service-flip { position:relative; min-height:220px; perspective:1200px; transition:transform .2s ease; }
.free-service .service-face-front { border-color:var(--line); background:var(--panel); }
.free-service .price strong { color:#000; }
.price-card { position:relative; display:block; width:100%; min-height:220px; padding:0; border:0; border-radius:18px; background:transparent; color:inherit; font:inherit; text-align:left; cursor:pointer; transform-style:preserve-3d; transition:transform .65s cubic-bezier(.2,.75,.25,1); }
.service-flip.is-flipped .price-card { transform:rotateY(180deg); }
@media (hover:hover) and (pointer:fine) { .service-flip:hover .price-card { transform:rotateY(180deg); } }
@media (hover:hover) and (pointer:fine) { .service-flip:hover { transform:translateY(-3px); } .service-flip:hover .service-face { box-shadow:0 4px 8px rgba(20,43,69,.1),0 12px 24px rgba(20,43,69,.12); } }
.price-card:focus-visible { outline:3px solid var(--accent); outline-offset:5px; }
.service-face { position:absolute; inset:0; display:flex; flex-direction:column; justify-content:space-between; gap:12px; padding:22px 22px 84px; border:1px solid var(--line); border-radius:14px; background:var(--panel); color:#000; box-shadow:0 2px 4px rgba(20,43,69,.08),0 8px 18px rgba(20,43,69,.08); backface-visibility:hidden; -webkit-backface-visibility:hidden; }
.service-face-front { transform:rotateY(0); }
.service-face-back { justify-content:flex-start; transform:rotateY(180deg); background:var(--panel); }
.service-title { display:block; margin:0 0 7px; color:#000; font-size:1.06rem; font-weight:700; letter-spacing:-.025em; }
.service-face .muted,.service-face .flip-hint,.service-details { color:#000; }
.service-face .muted { display:block; margin:0; font-size:.92rem; line-height:1.55; }
.service-details { display:block; font-size:.91rem; line-height:1.6; }
.service-book-button { position:absolute; z-index:2; left:22px; bottom:12px; padding:7px 12px; border:1px solid var(--line); border-radius:14px; background:#fff; color:#000; font:700 .78rem/1.4 "Montserrat",Inter,ui-sans-serif,system-ui,sans-serif; text-align:left; cursor:pointer; box-shadow:0 2px 4px rgba(20,43,69,.08),0 6px 12px rgba(20,43,69,.08); transition:background .2s ease,border-color .2s ease,transform .2s ease,box-shadow .2s ease; }
.service-book-button:hover { transform:translateY(-2px); border-color:var(--accent); background:#fff; color:#000; box-shadow:0 4px 8px rgba(20,43,69,.1),0 9px 16px rgba(20,43,69,.12); }
.service-book-button:focus-visible { outline-offset:2px; }
.price { display:grid; min-width:132px; margin:0; color:var(--accent-dark); text-align:right; }
.price strong { font-size:1.35rem; line-height:1.3; }
.price span { color:var(--muted); font-size:.78rem; }
.service-face .price,.service-face .price strong,.service-face .price span { color:#000; }
.faq { max-width:900px; margin:44px auto 0; }
.faq-heading { margin-bottom:16px; }
.faq-heading h2 { margin:8px 0 0; font-size:clamp(1.5rem,3vw,2rem); }
.faq-list { display:grid; gap:10px; }
.faq-item { overflow:hidden; border:1px solid var(--line); border-radius:14px; background:#fff; box-shadow:0 2px 4px rgba(20,43,69,.08),0 8px 18px rgba(20,43,69,.08); transition:border-color .2s ease,box-shadow .2s ease; }
.faq-item[open] { border-color:var(--accent); box-shadow:0 4px 8px rgba(20,43,69,.1),0 12px 24px rgba(20,43,69,.12); }
.faq-item summary { display:flex; justify-content:space-between; align-items:center; gap:18px; padding:16px 18px; color:#000; font-weight:700; cursor:pointer; list-style:none; }
.faq-item summary::-webkit-details-marker { display:none; }
.faq-item summary::after { content:"+"; flex:none; color:var(--accent); font-size:1.4rem; line-height:1; }
.faq-item[open] summary::after { content:"−"; }
.faq-answer { margin:0; padding:0 18px 18px; color:#000; }
.pricing-note { max-width:900px; margin:20px auto 0; color:var(--muted); font-size:.88rem; text-align:center; }
.pricing-actions { justify-content:center; max-width:900px; margin-left:auto; margin-right:auto; }
.contact-form { display:grid; gap:18px; text-align:left; }
.field { display:grid; gap:7px; }
.field label { color:#000; font-size:14px; }
.field input,.field textarea { width:100%; border:1px solid var(--line); border-radius:12px; padding:13px 14px; color:#000; background:#fff; font:inherit; outline:none; transition:border-color .2s ease,box-shadow .2s ease; }
.field select { width:100%; border:1px solid var(--line); border-radius:12px; padding:13px 14px; color:#000; background:#fff; font:inherit; outline:none; transition:border-color .2s ease,box-shadow .2s ease; }
.field textarea { min-height:170px; resize:vertical; }
.field input:focus,.field textarea:focus,.field select:focus { border-color:var(--accent); box-shadow:0 0 0 4px rgba(20,43,69,.12); }
.form-note { margin:0; color:var(--muted); font-size:13px; }
.booking-dialog { width:min(620px,calc(100% - 28px)); max-height:min(90vh,860px); padding:26px; border:1px solid var(--line); border-radius:14px; background:#fff; color:#000; box-shadow:0 2px 4px rgba(20,43,69,.08),0 8px 18px rgba(20,43,69,.08); }
.booking-dialog .eyebrow,.booking-dialog .field label,.booking-dialog .form-note { color:#000; }
.booking-dialog::backdrop { background:rgba(14,30,48,.58); backdrop-filter:blur(4px); }
.booking-dialog-heading { display:flex; justify-content:space-between; align-items:flex-start; gap:20px; margin-bottom:20px; }
.booking-dialog-heading h2 { margin:8px 0 0; font-size:clamp(1.35rem,3vw,1.8rem); font-weight:500; }
.dialog-close { display:grid; place-items:center; flex:none; width:38px; height:38px; border:1px solid var(--line); border-radius:12px; background:#fff; color:#000; font:inherit; font-size:1.5rem; cursor:pointer; box-shadow:0 2px 4px rgba(20,43,69,.08),0 8px 18px rgba(20,43,69,.08); }
.booking-form { max-height:calc(90vh - 130px); overflow:auto; padding:2px; }
.booking-actions { justify-content:flex-start; margin-top:4px; }
footer { display:flex; flex-direction:column; align-items:center; gap:8px; padding:18px 0 12px; border-top:none; color:var(--muted); font-size:13px; text-align:center; }
footer a { text-decoration-color:var(--accent); text-underline-offset:4px; }
.brand-caption { font-size:.72rem; }
.brand-logos { display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); width:min(100%,760px); margin:0 auto; }
.brand-logo { display:grid; place-items:center; min-height:58px; border-left:1px solid var(--line); }
.brand-logo:nth-child(5n + 1) { border-left:0; }
.brand-logo img { display:block; width:100px; height:48px; object-fit:contain; }
@keyframes pageIn { from { opacity:0; } to { opacity:1; } }
@keyframes riseIn { from { opacity:0; transform:translateY(18px); } to { opacity:1; transform:translateY(0); } }
@keyframes logoBreathe { 0%,100% { transform:scale(1); filter:drop-shadow(0 12px 20px rgba(20,43,69,.08)); } 50% { transform:scale(1.012); filter:drop-shadow(0 16px 28px rgba(20,43,69,.16)); } }
@keyframes orbit { to { transform:rotate(360deg); } }
@keyframes sway { 0%,100% { transform:rotate(7deg); } 50% { transform:rotate(12deg); } }
@keyframes pulse { 0%,100% { box-shadow:0 0 0 5px #73a87922; } 50% { box-shadow:0 0 0 9px #73a87908; } }
@keyframes ambientDrift { from { transform:translate3d(0,0,0) rotate(0deg); } to { transform:translate3d(40px,28px,0) rotate(18deg); } }
@media (prefers-reduced-motion:reduce) { *,*::before,*::after { animation-duration:.01ms !important; animation-iteration-count:1 !important; scroll-behavior:auto !important; transition-duration:.01ms !important; } .js .reveal { opacity:1; transform:none; } }
@media (max-width:760px) { .wrap { width:min(100% - 28px,1060px); } header { align-items:center; flex-direction:column; gap:14px; padding-top:14px; } nav { gap:12px 20px; flex-wrap:wrap; justify-content:center; } main { padding-top:24px; } .home-intro { border-radius:22px; } .owner-contact { margin-bottom:40px; } .contact-links { gap:12px 20px; } .trust-list { justify-content:flex-start; } .feature-grid,.process-grid { grid-template-columns:1fr; gap:12px; } .feature { min-height:0; } .page-intro { margin-bottom:30px; } .content-card { padding:22px; } .contact-direct { align-items:stretch; flex-direction:column; padding:22px; } .direct-actions { justify-content:flex-start; } .price-list { grid-template-columns:1fr; } .service-flip { min-height:230px; } .price-card { min-height:230px; } .price { min-width:96px; } .price strong { font-size:1.12rem; } .pricing-actions { justify-content:center; } .booking-dialog { padding:20px; } .booking-actions { justify-content:stretch; } .booking-actions .button { justify-content:center; flex:1 1 100%; } .brand-logos { grid-template-columns:repeat(3,minmax(0,1fr)); } .brand-logo:nth-child(5n + 1) { border-left:1px solid var(--line); } .brand-logo:nth-child(3n + 1) { border-left:0; } }

/* Homepage refresh */
.homepage { --ink:#13263c; --navy:#142b45; --teal:#00a9a0; --cream:#f5f7f4; }
.homepage .site-header { position:relative; z-index:4; }
.homepage .site-header { position:sticky; top:0; padding-top:16px; padding-bottom:12px; background:rgba(255,255,255,.9); backdrop-filter:blur(14px); }
.homepage .nav-call { margin-left:6px; border-color:var(--teal); background:#e8f7f3; color:#126d69; font-weight:800; }
.homepage .nav-call:hover { border-color:var(--teal); background:var(--teal); color:#fff; }
.announcement { display:flex; align-items:center; justify-content:center; gap:9px; margin:14px auto 0; color:#496072; font-size:.75rem; letter-spacing:.02em; }
.announcement a { color:var(--navy); font-weight:800; text-underline-offset:4px; }
.status-dot { width:7px; height:7px; border-radius:50%; background:var(--teal); box-shadow:0 0 0 5px rgba(0,169,160,.1); }
.hero-v2 { display:grid; grid-template-columns:minmax(0,1.02fr) minmax(360px,.98fr); gap:44px; align-items:center; min-height:610px; padding:74px 0 82px; }
.hero-copy { position:relative; z-index:2; }
.hero-logo-spotlight { width:min(100%,560px); margin:0 0 28px; padding:12px 18px; border:1px solid #d8e3df; border-radius:18px; background:#fff; box-shadow:0 14px 28px rgba(20,43,69,.08); }
.brand-hero-logo { display:block; width:100%; height:220px; object-fit:cover; object-position:center; border-radius:10px; }
.hero-copy .eyebrow { color:var(--teal); font-weight:700; }
.hero-copy h1 { max-width:650px; margin:18px 0 18px; color:var(--ink); font-size:clamp(3.4rem,7vw,6.25rem); font-weight:800; line-height:.94; letter-spacing:-.085em; }
.hero-copy h1 em { color:var(--teal); font-style:normal; }
.hero-lede { max-width:540px; margin:0; color:#526779; font-size:clamp(1rem,1.7vw,1.2rem); line-height:1.7; }
.hero-actions { justify-content:flex-start; margin-top:30px; }
.button-primary { border-color:var(--navy); background:var(--navy); color:#fff; box-shadow:0 12px 24px rgba(20,43,69,.18); }
.button-primary:hover { border-color:var(--teal); background:#0f7f7b; color:#fff; }
.button-quiet { border-color:transparent; color:var(--navy); background:transparent; box-shadow:none; }
.button-quiet:hover { border-color:#cdd8df; background:#fff; }
.hero-proof { display:flex; flex-wrap:wrap; gap:10px 20px; margin-top:31px; color:#617383; font-size:.76rem; }
.hero-proof b { margin-right:5px; color:var(--teal); font-size:1rem; }
.hero-visual { position:relative; min-height:435px; overflow:hidden; border-radius:30px; background:#dcece6; isolation:isolate; }
.hero-visual:before { content:""; position:absolute; inset:0; background:linear-gradient(135deg,rgba(255,255,255,.48),transparent 42%),radial-gradient(circle at 20% 18%,#fff9 0 1px,transparent 2px); background-size:auto,25px 25px; opacity:.65; }
.visual-sun { position:absolute; right:-20px; bottom:-80px; width:285px; height:285px; border-radius:50%; background:#f3bc78; box-shadow:0 0 0 22px rgba(243,188,120,.16),0 0 0 48px rgba(243,188,120,.1); }
.visual-orbit { position:absolute; border:1px solid rgba(20,43,69,.18); border-radius:50%; transform:rotate(-25deg); }
.orbit-one { width:470px; height:170px; left:-45px; top:60px; }.orbit-two { width:540px; height:235px; left:-70px; top:36px; transform:rotate(19deg); }
.visual-card { position:absolute; z-index:2; border:1px solid rgba(255,255,255,.7); background:rgba(255,255,255,.72); box-shadow:0 24px 60px rgba(20,43,69,.17); backdrop-filter:blur(12px); }
.visual-card-main { left:12%; top:22%; width:74%; min-height:220px; padding:22px; border-radius:22px; transform:rotate(-4deg); }
.hero-main-logo { display:block; width:100%; height:158px; object-fit:contain; object-position:center; border-radius:12px; background:#fff; }
.logo-caption { display:flex; justify-content:space-between; gap:12px; margin-top:15px; color:#6a7c86; font:10px monospace; letter-spacing:.12em; }
.logo-caption span:last-child { color:#187460; font-weight:700; }
.logo-caption i { display:inline-block; width:5px; height:5px; margin:0 4px 1px 0; border-radius:50%; background:#39a877; }
.visual-card-top,.visual-card-bottom { display:flex; justify-content:space-between; align-items:center; gap:12px; color:#6a7c86; font:10px monospace; letter-spacing:.12em; }
.live-pill { padding:5px 8px; border-radius:99px; background:#d4eee3; color:#187460; font-weight:700; }.live-pill i { display:inline-block; width:5px; height:5px; margin-right:4px; border-radius:50%; background:#39a877; }
.signal-row { display:flex; align-items:center; gap:15px; margin:54px 0 28px; color:var(--navy); }.signal-icon { display:grid; place-items:center; width:42px; height:42px; border-radius:13px; background:var(--navy); color:#fff; font-size:1.4rem; }.signal-row strong,.signal-row small { display:block; }.signal-row strong { font-size:1.15rem; }.signal-row small { margin-top:3px; color:#6a7c86; font-size:.72rem; }
.signal-bar { height:7px; overflow:hidden; border-radius:99px; background:#d3dfdc; }.signal-bar span { display:block; width:72%; height:100%; border-radius:inherit; background:var(--teal); }
.visual-card-bottom { margin-top:27px; }.visual-card-float { right:7%; bottom:12%; display:grid; grid-template-columns:auto 1fr; column-gap:11px; align-items:center; width:145px; padding:13px 15px; border-radius:15px; transform:rotate(6deg); }.float-icon { grid-row:span 2; display:grid; place-items:center; width:29px; height:29px; border-radius:9px; background:#f3bc78; color:var(--navy); font-weight:800; }.visual-card-float strong { color:var(--navy); font-size:.82rem; }.visual-card-float small { color:#71808b; font-size:.63rem; }
.service-section { padding:74px 0 84px; border-top:1px solid #dfe7e5; }.section-heading-left { display:flex; justify-content:space-between; align-items:end; gap:40px; margin-bottom:28px; text-align:left; }.section-heading-left h2 { max-width:630px; margin:9px 0 0; color:var(--ink); font-size:clamp(2rem,4vw,3.4rem); font-weight:800; }.section-heading-left p { max-width:300px; margin:0; color:#617383; font-size:.94rem; line-height:1.7; }.feature-grid-v2 { gap:14px; }.feature-v2 { position:relative; min-height:265px; padding:27px; border-color:#d9e1df; border-radius:20px; background:#fff; box-shadow:0 10px 25px rgba(20,43,69,.04); }.feature-v2:hover { border-color:var(--teal); box-shadow:0 18px 35px rgba(20,43,69,.1); }.feature-v2 .feature-icon { display:grid; place-items:center; width:42px; height:42px; margin-bottom:35px; border-radius:13px; background:#e5f5f0; color:var(--teal); font-size:1.55rem; }.feature-v2:nth-child(2) .feature-icon { background:#fff0df; color:#d9852b; }.feature-v2:nth-child(3) .feature-icon { background:#e8eaf7; color:#5e69b8; }.feature-v2 .feature-number { color:#758691; font-size:10px; letter-spacing:.12em; }.feature-v2 h3 { margin:9px 0 8px; color:var(--ink); font-size:1.2rem; }.feature-v2 h3 span { color:var(--teal); opacity:1; font-size:.9em; }.feature-v2 p { color:#617383; font-size:.88rem; line-height:1.7; }.feature-highlight { background:var(--navy); border-color:var(--navy); }.feature-highlight .feature-number,.feature-highlight p { color:#b9cad3; }.feature-highlight h3 { color:#fff; }.feature-highlight .feature-icon { background:#30536a; }.feature-highlight h3 span { color:#8ce0d1; }.feature-highlight:hover { border-color:var(--teal); }.service-section .section-cta { margin-top:28px; text-align:left; }.service-section .text-link { color:var(--navy); }
.split-section { display:grid; grid-template-columns:1fr 1fr; gap:70px; align-items:center; padding:78px 0; border-top:1px solid #dfe7e5; }.split-visual { position:relative; min-height:280px; display:flex; flex-direction:column; justify-content:center; overflow:hidden; padding:36px; border-radius:24px; background:var(--navy); color:#fff; }.split-visual:after { content:""; position:absolute; right:-80px; bottom:-120px; width:290px; height:290px; border:1px solid rgba(140,224,209,.45); border-radius:50%; box-shadow:0 0 0 28px rgba(140,224,209,.1),0 0 0 57px rgba(140,224,209,.06); }.split-kicker { position:relative; z-index:1; margin-bottom:25px; color:#8ce0d1; font:10px monospace; letter-spacing:.16em; }.split-visual strong { position:relative; z-index:1; font-size:clamp(2.2rem,4.3vw,4rem); line-height:.98; letter-spacing:-.07em; }.split-visual em { color:#8ce0d1; font-style:normal; }.split-mark { position:absolute; right:33px; top:28px; color:#f3bc78; font-size:2.3rem; }.split-copy .eyebrow { color:var(--teal); font-weight:700; }.split-copy h2 { margin:12px 0 14px; color:var(--ink); font-size:clamp(2rem,4vw,3.15rem); font-weight:800; }.split-copy p { max-width:470px; margin:0 0 24px; color:#617383; line-height:1.8; }.split-copy .text-link { color:var(--navy); }
.process-v2 { max-width:none; margin-top:0; padding:82px 0 86px; border-top:1px solid #dfe7e5; }.process-v2 .section-heading h2 { color:var(--ink); font-weight:800; }.process-v2 .process-step { min-height:190px; padding:24px; border:0; border-radius:18px; background:#f3f6f4; box-shadow:none; }.process-v2 .process-step:nth-child(2) { background:#e9f4f0; }.process-v2 .process-step:nth-child(3) { background:#fff1df; }.process-v2 .process-step > span { color:var(--teal); font-weight:700; }.process-v2 .process-step h3 { color:var(--ink); }.process-v2 .process-step p { color:#617383; }
.final-cta { display:flex; justify-content:space-between; align-items:center; gap:28px; margin:0 0 70px; padding:38px 42px; border-radius:22px; background:#e7f4ef; }.final-cta h2 { margin:9px 0 0; color:var(--ink); font-size:clamp(1.7rem,3.4vw,2.7rem); font-weight:800; }.final-cta .eyebrow { color:var(--teal); font-weight:700; }
.homepage footer { border-top:1px solid #dfe7e5; }
@media (max-width:760px) { .announcement { text-align:center; flex-wrap:wrap; }.hero-v2 { grid-template-columns:1fr; gap:30px; min-height:0; padding:58px 0 66px; }.hero-logo-spotlight { margin-bottom:22px; padding:8px 12px; }.brand-hero-logo { height:150px; }.hero-copy h1 { font-size:clamp(3.2rem,16vw,5rem); }.hero-proof { gap:8px 14px; }.hero-visual { min-height:355px; }.visual-card-main { left:7%; width:82%; }.hero-main-logo { height:128px; }.logo-caption { font-size:8px; }.section-heading-left,.split-section,.final-cta { display:flex; flex-direction:column; align-items:flex-start; }.section-heading-left { gap:15px; }.service-section { padding:58px 0 66px; }.split-section { gap:28px; padding:62px 0; }.split-visual { width:100%; min-height:250px; }.process-v2 { padding:64px 0 66px; }.final-cta { margin-bottom:50px; padding:30px 24px; }.final-cta .button { width:100%; justify-content:center; } }

/* Footer brand wall */
.homepage footer { gap:14px; padding:42px 0 24px; }
.homepage .brand-caption { color:#687b87; font-size:.68rem; font-weight:800; letter-spacing:.16em; text-transform:uppercase; }
.homepage .brand-logos { display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:10px; width:100%; max-width:900px; margin:6px auto 10px; }
.homepage .brand-logo { min-height:68px; border:1px solid #dfe7e5; border-radius:15px; background:#fbfcfb; box-shadow:0 4px 12px rgba(20,43,69,.035); transition:transform .2s ease,border-color .2s ease,box-shadow .2s ease; }
.homepage .brand-logo:nth-child(5n + 1), .homepage .brand-logo:nth-child(3n + 1) { border-left:1px solid #dfe7e5; }
.homepage .brand-logo:hover { transform:translateY(-3px); border-color:#9edbd1; box-shadow:0 10px 18px rgba(20,43,69,.08); }
.homepage .brand-logo img { width:94px; height:42px; object-fit:contain; filter:grayscale(1) opacity(.7); transition:filter .2s ease,opacity .2s ease; }
.homepage .brand-logo:hover img { filter:grayscale(0) opacity(1); }
.homepage .footer-copy { color:#8898a1; font-size:.74rem; }
@media (max-width:760px) { .homepage .brand-logos { grid-template-columns:repeat(3,minmax(0,1fr)); gap:8px; }.homepage .brand-logo { min-height:62px; border-left:1px solid #dfe7e5; }.homepage .brand-logo:nth-child(3n + 1) { border-left:1px solid #dfe7e5; }.homepage .brand-logo img { width:76px; height:36px; } }

/* Shared site polish */
body:not(:has(.homepage)) header { position:sticky; top:0; z-index:10; background:rgba(255,255,255,.92); backdrop-filter:blur(14px); }
body:not(:has(.homepage)) .nav-call { margin-left:6px; border-color:var(--teal); background:#e8f7f3; color:#126d69; font-weight:800; }
body:not(:has(.homepage)) .nav-call:hover { border-color:var(--teal); background:var(--teal); color:#fff; }
body:not(:has(.homepage)) main { padding-top:58px; }
body:not(:has(.homepage)) .page-intro { padding:28px 22px 0; }
body:not(:has(.homepage)) .page-intro h1 { color:var(--accent); font-weight:800; }
body:not(:has(.homepage)) .page-intro .eyebrow { color:var(--teal); font-weight:700; }
body:not(:has(.homepage)) .content-card, body:not(:has(.homepage)) .contact-direct, body:not(:has(.homepage)) .faq-item, body:not(:has(.homepage)) .service-face { border-color:#dfe7e5; box-shadow:0 12px 28px rgba(20,43,69,.06); }
body:not(:has(.homepage)) .content-card:hover, body:not(:has(.homepage)) .contact-direct:hover { border-color:#9edbd1; box-shadow:0 18px 34px rgba(20,43,69,.09); }
body:not(:has(.homepage)) footer { margin-top:40px; padding-top:28px; border-top:1px solid #dfe7e5; }
@media (max-width:760px) { body:not(:has(.homepage)) header { position:relative; } body:not(:has(.homepage)) main { padding-top:30px; } body:not(:has(.homepage)) .page-intro { padding:16px 0 0; } body:not(:has(.homepage)) .nav-call { margin-left:0; } }

/* Sales page */
.sales-page { --sales-ink:#13263c; --sales-teal:#00a9a0; }
.sales-page main { padding-top:0; }
.sales-page header { position:sticky; top:0; z-index:10; background:rgba(255,255,255,.92); backdrop-filter:blur(14px); }
.sales-page .nav-call { margin-left:6px; border-color:var(--sales-teal); background:#e8f7f3; color:#126d69; font-weight:800; }
.sales-page .nav-call:hover { background:var(--sales-teal); color:#fff; }
.sales-hero { max-width:820px; padding:84px 0 54px; text-align:left; }
.sales-hero .eyebrow { color:var(--sales-teal); font-weight:800; }
.sales-hero h1 { max-width:720px; margin:14px 0 18px; color:var(--sales-ink); font-size:clamp(3rem,6vw,5.5rem); font-weight:800; line-height:.98; letter-spacing:-.08em; }
.sales-lede { max-width:700px; margin:0; color:#5f7380; font-size:clamp(1rem,1.6vw,1.15rem); line-height:1.8; }
.sales-badges { display:flex; flex-wrap:wrap; gap:8px; margin-top:28px; }.sales-badges span { padding:8px 12px; border:1px solid #cfe7df; border-radius:99px; background:#eef9f5; color:#16736a; font-size:.75rem; font-weight:800; }
.reseller-note { display:flex; align-items:flex-start; gap:16px; margin:0 0 78px; padding:24px 26px; border:1px solid #e2e9e6; border-radius:18px; background:#f5f8f6; }.reseller-note-mark { display:grid; place-items:center; flex:none; width:34px; height:34px; border-radius:50%; background:var(--sales-ink); color:#fff; font-weight:800; }.reseller-note strong { color:var(--sales-ink); }.reseller-note p { max-width:750px; margin:5px 0 0; color:#617383; font-size:.9rem; line-height:1.7; }
.sales-categories { padding-bottom:84px; }.sales-categories > .eyebrow { color:var(--sales-teal); font-weight:800; }.sales-categories h2,.sales-process h2,.brand-strip h2,.sales-cta h2 { margin:10px 0 28px; color:var(--sales-ink); font-size:clamp(2rem,4vw,3.4rem); font-weight:800; letter-spacing:-.06em; }.sales-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:14px; }.sales-card { display:flex; flex-direction:column; min-height:340px; padding:25px; border:1px solid #dfe7e5; border-radius:20px; background:#fff; box-shadow:0 10px 25px rgba(20,43,69,.04); transition:transform .2s ease,border-color .2s ease,box-shadow .2s ease; }.sales-card:hover { transform:translateY(-4px); border-color:#9edbd1; box-shadow:0 18px 34px rgba(20,43,69,.1); }.sales-card-dark { border-color:var(--sales-ink); background:var(--sales-ink); color:#fff; }.sales-card-code { color:#71848d; font:10px monospace; letter-spacing:.12em; }.sales-card-dark .sales-card-code { color:#9edbd1; }.sales-card-icon { display:grid; place-items:center; width:46px; height:46px; margin:30px 0 20px; border-radius:14px; background:#e7f6f1; color:var(--sales-teal); font-size:1.3rem; font-weight:800; }.sales-card:nth-child(2) .sales-card-icon { background:#fff0df; color:#d9852b; }.sales-card:nth-child(3) .sales-card-icon { background:#e8eaf7; color:#5e69b8; }.sales-card:nth-child(4) .sales-card-icon { background:#f1e9f7; color:#9665aa; }.sales-card-dark .sales-card-icon { background:#31536a; color:#8ce0d1; }.sales-card h3 { margin:0 0 10px; color:var(--sales-ink); font-size:1.18rem; }.sales-card-dark h3 { color:#fff; }.sales-card p { margin:0; color:#647781; font-size:.86rem; line-height:1.7; }.sales-card-dark p { color:#c2d2d8; }.sales-card a { margin-top:auto; padding-top:22px; color:var(--sales-teal); font-size:.82rem; font-weight:800; text-underline-offset:4px; }.sales-card-dark a { color:#8ce0d1; }
.sales-process { display:grid; grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr); gap:70px; align-items:center; padding:78px 0; border-top:1px solid #dfe7e5; }.sales-process h2 { margin-bottom:14px; }.sales-process p { max-width:450px; margin:0; color:#617383; line-height:1.8; }.sales-steps { display:grid; gap:10px; }.sales-steps > div { display:grid; grid-template-columns:40px 1fr; column-gap:14px; padding:17px 18px; border-radius:15px; background:#f2f6f4; }.sales-steps > div:nth-child(2) { background:#e9f4f0; }.sales-steps > div:nth-child(3) { background:#fff1df; }.sales-steps b { grid-row:span 2; color:var(--sales-teal); font:12px monospace; }.sales-steps strong { color:var(--sales-ink); font-size:.94rem; }.sales-steps span { color:#70818a; font-size:.78rem; }
.brand-strip { display:flex; justify-content:space-between; align-items:center; gap:40px; padding:78px 0; border-top:1px solid #dfe7e5; }.brand-strip h2 { max-width:360px; margin-bottom:0; font-size:clamp(1.8rem,3vw,2.6rem); }.sales-brand-logos { display:grid; grid-template-columns:repeat(3,1fr); gap:8px; width:min(100%,380px); }.sales-brand-logos img { width:100%; height:54px; padding:10px; border:1px solid #dfe7e5; border-radius:12px; object-fit:contain; filter:grayscale(1) opacity(.65); }.sales-cta { display:flex; justify-content:space-between; align-items:center; gap:28px; margin:0 0 70px; padding:38px 42px; border-radius:22px; background:#e7f4ef; }.sales-cta h2 { margin:8px 0 4px; font-size:clamp(1.8rem,3.2vw,2.8rem); }.sales-cta p { margin:0; color:#617383; }.sales-cta .button { flex:none; }
@media (max-width:900px) { .sales-grid { grid-template-columns:repeat(2,1fr); } }
@media (max-width:760px) { .sales-page header { position:relative; }.sales-page .nav-call { margin-left:0; }.sales-hero { padding:52px 0 40px; }.sales-hero h1 { font-size:clamp(3rem,15vw,5rem); }.reseller-note { margin-bottom:56px; padding:20px; }.sales-grid { grid-template-columns:1fr; }.sales-card { min-height:290px; }.sales-process,.brand-strip,.sales-cta { display:flex; flex-direction:column; align-items:flex-start; gap:28px; padding:60px 0; }.sales-brand-logos { width:100%; }.sales-cta { margin-bottom:48px; padding:28px 24px; }.sales-cta .button { width:100%; text-align:center; } }

/* Compact product catalog */
.catalog-heading { max-width:720px; padding:76px 0 42px; }.catalog-heading .eyebrow { color:var(--sales-teal); font-weight:800; }.catalog-heading h1 { margin:12px 0 14px; color:var(--sales-ink); font-size:clamp(3rem,6vw,5.2rem); font-weight:800; line-height:.98; letter-spacing:-.08em; }.catalog-heading p { max-width:620px; margin:0; color:#617383; line-height:1.8; }
.catalog-disclosure { display:flex; gap:12px; align-items:center; margin:-16px 0 24px; color:#617383; font-size:.78rem; }.catalog-disclosure strong { color:var(--sales-ink); }.catalog-disclosure span { padding-left:12px; border-left:1px solid #cbd9d5; }
.product-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:14px; padding-bottom:34px; }.product-card { overflow:hidden; border:1px solid #dfe7e5; border-radius:20px; background:#fff; box-shadow:0 10px 25px rgba(20,43,69,.05); transition:transform .2s ease,border-color .2s ease,box-shadow .2s ease; }.product-card:hover { transform:translateY(-4px); border-color:#9edbd1; box-shadow:0 18px 34px rgba(20,43,69,.12); }.product-image-link { display:block; overflow:hidden; background:#eef3f2; }.product-image-link img { display:block; width:100%; aspect-ratio:1; object-fit:cover; transition:transform .45s ease; }.product-card:hover .product-image-link img { transform:scale(1.04); }.product-card-body { padding:20px 20px 22px; }.product-tag { color:var(--sales-teal); font:10px monospace; font-weight:700; letter-spacing:.14em; }.product-card h2 { margin:8px 0 6px; color:var(--sales-ink); font-size:1.25rem; }.product-card p { min-height:48px; margin:0; color:#617383; font-size:.83rem; line-height:1.6; }.product-link { display:inline-block; margin-top:18px; color:var(--sales-ink); font-size:.82rem; font-weight:800; text-underline-offset:4px; }.product-link span { color:var(--sales-teal); }.catalog-note { display:flex; align-items:center; gap:16px; margin:0 0 64px; padding:22px 24px; border-radius:18px; background:#e7f4ef; }.catalog-note strong { color:var(--sales-ink); }.catalog-note > span { flex:1; color:#617383; font-size:.84rem; }.catalog-note .button { white-space:nowrap; }.sales-page footer { border-top:1px solid #dfe7e5; padding:24px 0; }
@media (max-width:1050px) { .product-grid { grid-template-columns:repeat(2,1fr); } }
@media (max-width:760px) { .catalog-heading { padding:52px 0 30px; }.catalog-heading h1 { font-size:clamp(3rem,15vw,5rem); }.catalog-disclosure { align-items:flex-start; flex-direction:column; margin:-6px 0 22px; }.catalog-disclosure span { padding:0; border:0; }.product-grid { grid-template-columns:1fr; gap:14px; }.product-card-body { padding:18px 18px 20px; }.product-card p { min-height:0; }.catalog-note { align-items:flex-start; flex-direction:column; margin-bottom:42px; padding:22px; }.catalog-note .button { width:100%; text-align:center; } }

/* Shop controls and sales cues */
.catalog-toolbar { display:flex; align-items:end; justify-content:space-between; gap:22px; margin:0 0 24px; padding:16px; border:1px solid #dfe7e5; border-radius:18px; background:#f7faf8; }.catalog-search { display:grid; gap:6px; min-width:260px; }.catalog-search label { color:var(--sales-ink); font-size:.75rem; font-weight:800; }.catalog-search input { width:100%; padding:11px 13px; border:1px solid #d3e0dc; border-radius:10px; background:#fff; color:var(--sales-ink); font:inherit; outline:none; }.catalog-search input:focus { border-color:var(--sales-teal); box-shadow:0 0 0 4px rgba(0,169,160,.12); }.catalog-filters { display:flex; flex-wrap:wrap; justify-content:flex-end; gap:7px; }.catalog-filter { padding:9px 12px; border:1px solid #d3e0dc; border-radius:99px; background:#fff; color:#637681; font:700 .74rem/1.2 Montserrat, sans-serif; cursor:pointer; transition:background .2s ease,border-color .2s ease,color .2s ease; }.catalog-filter:hover,.catalog-filter.is-active { border-color:var(--sales-teal); background:var(--sales-teal); color:#fff; }.product-card { position:relative; }.product-card[hidden] { display:none; }.product-ribbon { position:absolute; z-index:2; top:14px; left:14px; padding:6px 8px; border-radius:99px; background:var(--sales-ink); color:#fff; font:700 9px/1 Montserrat, sans-serif; letter-spacing:.08em; }.product-card:nth-child(3) .product-ribbon { background:#d9852b; }.product-card:nth-child(8) .product-ribbon { background:#7b65a7; }.quote-button { border:0; padding-left:0; background:transparent; cursor:pointer; font-family:inherit; }.quote-button.is-added { color:var(--sales-teal); }.catalog-note { justify-content:space-between; }.catalog-note > div { display:grid; gap:4px; }.catalog-note > div > span { color:#617383; font-size:.82rem; }.catalog-note strong { font-size:.95rem; }
@media (max-width:850px) { .catalog-toolbar { align-items:stretch; flex-direction:column; }.catalog-search { min-width:0; }.catalog-filters { justify-content:flex-start; } }

/* Tools library */
.tools-page main { padding-top:0; }.tools-heading { padding:70px 0 40px; }.tools-heading h1 { color:var(--accent); font-weight:800; }.tools-heading .eyebrow,.library-heading .eyebrow { color:var(--teal); font-weight:800; }.quick-workbench { margin-bottom:76px; padding:28px; border:1px solid #dfe7e5; border-radius:22px; background:#f3f7f5; }.quick-heading { display:flex; align-items:flex-start; justify-content:space-between; gap:20px; }.quick-heading h2,.library-heading h2 { margin:8px 0 20px; color:var(--accent); font-size:clamp(1.8rem,3vw,2.7rem); font-weight:800; letter-spacing:-.06em; }.local-badge { padding:8px 11px; border-radius:99px; background:#d9f2e9; color:#16736a; font:700 .7rem Montserrat,sans-serif; white-space:nowrap; }.quick-tabs { display:flex; flex-wrap:wrap; gap:8px; margin-bottom:18px; }.quick-tab { padding:9px 12px; border:1px solid #cddbd6; border-radius:99px; background:#fff; color:#637681; font:700 .75rem Montserrat,sans-serif; cursor:pointer; }.quick-tab:hover,.quick-tab.is-active { border-color:var(--teal); background:var(--teal); color:#fff; }.quick-panel { display:none; padding:20px; border:1px solid #d8e4df; border-radius:16px; background:#fff; }.quick-panel.is-active { display:block; }.quick-panel label { display:block; margin-bottom:7px; color:var(--accent); font-size:.8rem; font-weight:800; }.quick-panel textarea,.quick-panel input,.quick-panel select { width:100%; padding:12px 13px; border:1px solid #d3e0dc; border-radius:10px; background:#fff; color:var(--accent); font:inherit; outline:none; }.quick-panel textarea { min-height:130px; resize:vertical; }.quick-panel input:focus,.quick-panel textarea:focus,.quick-panel select:focus { border-color:var(--teal); box-shadow:0 0 0 4px rgba(0,169,160,.12); }.quick-actions { display:flex; flex-wrap:wrap; gap:8px; margin-top:12px; }.quick-actions .button { padding:9px 12px; font-size:.78rem; cursor:pointer; }.quick-result { margin:14px 0 0; color:#637681; font-size:.82rem; }.quick-output { display:grid; grid-template-columns:minmax(100px,140px) 1fr; gap:5px 16px; margin:16px 0 0; padding:14px; border-radius:10px; background:#f3f7f5; color:#536974; font-size:.82rem; }.quick-output dt { font-weight:800; }.quick-output dd { margin:0; overflow-wrap:anywhere; }.quick-output.single { display:block; min-height:1.4em; color:var(--accent); font-weight:800; }.tool-library { padding-bottom:70px; }.library-heading { display:flex; justify-content:space-between; align-items:end; gap:28px; margin-bottom:26px; }.library-heading h2 { margin-bottom:0; }.tool-search { display:grid; gap:6px; width:min(100%,300px); }.tool-search label { color:var(--accent); font-size:.75rem; font-weight:800; }.tool-search input { padding:11px 13px; border:1px solid #d3e0dc; border-radius:10px; font:inherit; }.tool-library-grid { display:grid; gap:24px; }.tool-category { padding:24px; border:1px solid #dfe7e5; border-radius:20px; background:#fff; box-shadow:0 10px 25px rgba(20,43,69,.04); }.tool-category[hidden] { display:none; }.tool-category-heading { display:flex; align-items:center; gap:14px; margin-bottom:20px; }.tool-category-icon { display:grid; place-items:center; width:42px; height:42px; border-radius:13px; background:var(--accent); color:#fff; font:12px monospace; }.tool-category:nth-child(2) .tool-category-icon { background:#d9852b; }.tool-category:nth-child(3) .tool-category-icon { background:#5e69b8; }.tool-category:nth-child(4) .tool-category-icon { background:var(--teal); }.tool-category-heading h3 { margin:0; color:var(--accent); font-size:1.25rem; }.tool-category-heading p { margin:4px 0 0; color:#71828b; font-size:.8rem; }.tool-cards { display:grid; grid-template-columns:repeat(4,1fr); gap:10px; }.tool-directory-card { min-height:135px; padding:16px; border:1px solid #e2e9e6; border-radius:14px; background:#fbfcfb; transition:transform .2s ease,border-color .2s ease,box-shadow .2s ease; }.tool-directory-card:hover { transform:translateY(-3px); border-color:#9edbd1; box-shadow:0 9px 18px rgba(20,43,69,.08); }.tool-directory-card[hidden] { display:none; }.tool-directory-card span { color:var(--teal); font:9px monospace; font-weight:800; letter-spacing:.12em; }.tool-directory-card h4 { margin:9px 0 6px; color:var(--accent); font-size:.94rem; }.tool-directory-card p { margin:0; color:#6b7d86; font-size:.78rem; line-height:1.55; }.tools-page footer { border-top:1px solid #dfe7e5; padding:24px 0; }
@media (max-width:900px) { .tool-cards { grid-template-columns:repeat(2,1fr); } }
@media (max-width:760px) { .tools-page header { position:relative; }.tools-page .nav-call { margin-left:0; }.tools-heading { padding:50px 0 30px; }.quick-workbench { padding:20px; }.quick-heading,.library-heading { align-items:flex-start; flex-direction:column; }.local-badge { order:-1; }.tool-search { width:100%; }.tool-category { padding:18px; }.tool-cards { grid-template-columns:1fr; }.tool-directory-card { min-height:0; } }

/* Functional browser tool studio */
.tool-studio { margin:0 0 76px; padding:28px; border:1px solid #dfe7e5; border-radius:22px; background:#f3f7f5; box-shadow:0 12px 28px rgba(20,43,69,.05); }
.studio-heading { display:flex; align-items:flex-start; justify-content:space-between; gap:20px; margin-bottom:22px; }.studio-heading h2 { margin:8px 0 0; color:var(--accent); font-size:clamp(1.8rem,3vw,2.7rem); font-weight:800; letter-spacing:-.06em; }.studio-select-label,.studio-fields label { display:grid; gap:7px; color:var(--accent); font-size:.78rem; font-weight:800; }.studio-select-label { max-width:420px; }.tool-studio select,.tool-studio input,.tool-studio textarea { width:100%; padding:12px 13px; border:1px solid #d3e0dc; border-radius:10px; background:#fff; color:var(--accent); font:inherit; outline:none; }.tool-studio textarea { min-height:130px; resize:vertical; }.tool-studio select:focus,.tool-studio input:focus,.tool-studio textarea:focus { border-color:var(--teal); box-shadow:0 0 0 4px rgba(0,169,160,.12); }.studio-fields { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px; margin-top:16px; }.studio-fields label:first-child:last-child { grid-column:1/-1; }.studio-fields textarea { min-height:150px; }.studio-actions { display:flex; flex-wrap:wrap; gap:8px; margin-top:16px; }.studio-actions .button { cursor:pointer; }.studio-result { min-height:120px; margin-top:16px; padding:16px; overflow:auto; border:1px solid #d8e4df; border-radius:12px; background:#fff; color:#536974; font:500 .86rem/1.65 ui-monospace,SFMono-Regular,Consolas,monospace; white-space:pre-wrap; overflow-wrap:anywhere; }.studio-result h1,.studio-result h2,.studio-result h3 { margin:.2em 0; color:var(--accent); font-family:inherit; }.studio-result strong { color:var(--teal); }.studio-result code { padding:2px 5px; border-radius:5px; background:#eef4f1; color:var(--accent); }
@media (max-width:760px) { .tool-studio { padding:20px; }.studio-heading { flex-direction:column; }.studio-fields { grid-template-columns:1fr; }.studio-fields label:first-child:last-child { grid-column:auto; } }
.tool-directory-card { cursor:pointer; }.tool-directory-card:focus-visible { outline:3px solid rgba(0,169,160,.35); outline-offset:3px; }
.tool-modal .studio-actions .button-primary { border:1px solid #142b45; background:#142b45; color:#fff; box-shadow:0 10px 20px rgba(20,43,69,.18); }.tool-modal .studio-actions .button-primary:hover { border-color:#00a9a0; background:#0f7f7b; color:#fff; }.tool-modal .studio-actions .button-primary:active { transform:translateY(1px); background:#0b6663; }.tool-modal .studio-actions .button-primary:disabled { opacity:.55; cursor:not-allowed; }
.modal-open { overflow:hidden; }.tool-modal[hidden] { display:none; }.tool-modal { position:fixed; z-index:100; inset:0; display:grid; place-items:center; padding:20px; background:rgba(19,38,60,.58); }.tool-modal-card { position:relative; width:min(720px,100%); max-height:min(760px,calc(100vh - 40px)); overflow:auto; padding:30px; border:1px solid #dfe7e5; border-radius:22px; background:#fff; box-shadow:0 24px 70px rgba(19,38,60,.28); }.tool-modal-card h2 { margin:8px 0 8px; color:var(--accent); font-size:clamp(1.8rem,4vw,2.8rem); }.tool-modal-card > p { margin:0 0 20px; color:#617383; line-height:1.7; }.tool-modal-close { position:absolute; top:14px; right:16px; width:36px; height:36px; border:0; border-radius:50%; background:#eef4f1; color:var(--accent); font-size:1.5rem; line-height:1; cursor:pointer; }.tool-modal-close:hover { background:#d9f2e9; }.tool-modal-note { padding:16px; border-radius:12px; background:#f3f7f5; color:#617383; line-height:1.6; }
@media (max-width:760px) { .tool-modal-card { padding:24px 20px; }.tool-modal { padding:12px; } }