/* Varied deep surfaces with light, readable foregrounds. */
:root {
  color-scheme: dark;
  --ink: #f2f6fc;
  --text: #bdcad9;
  --paper: #101e30;
  --line: #ffffff24;
}
body { background: #0b1624; color: var(--ink); }
.skip { background: #e3bd76; color: #142234; }
.kicker, .inline-link, .inline-link span { color: #e3bd76; }
.muted { color: #9bb3cd; }
.why-copy { border-color: #e3bd7660; }
.features { background: linear-gradient(155deg, #122238, #0c1a2b); border-block: 1px solid #ffffff0b; }
.feature { --accent: #a5cfff; background: #153752; border-color: #315575; }
.feature:nth-child(2) { --accent: #91e2bf; background: #123c34; border-color: #2a6352; }
.feature:nth-child(3) { --accent: #d3b4ff; background: #342448; border-color: #61467c; }
.feature:nth-child(4) { --accent: #ffb6c6; background: #482636; border-color: #794658; }
.feature:nth-child(5) { --accent: #8fe0eb; background: #123d49; border-color: #2c6573; }
.feature:nth-child(6) { --accent: #f2cf8b; background: #42351f; border-color: #6d5832; }
.feature-icon { background: #08101c38; border-color: #ffffff20; }
.feature p { color: #e0e7ee; }
.feature:hover { box-shadow: 0 18px 38px #0003; }
.seo-note, .pricing-note { color: #a9bad0; }
.step-grid { gap: 25px; }
.step-grid article { padding: 34px 26px 23px; border: 1px solid; border-radius: 12px; }
.step-grid article:nth-child(1) { background: #11372f; border-color: #2a5c4f; }
.step-grid article:nth-child(2) { background: #182f4d; border-color: #34547d; }
.step-grid article:nth-child(3) { background: #302343; border-color: #5c4675; }
.step-grid p { color: #ccd9e7; }
.step-number { right: 26px; color: #a1ebc7; background: #184d40; border-color: #559c81; }
.step-grid article:nth-child(2) .step-number { color: #b5d6ff; background: #24466f; border-color: #5e88bc; }
.step-grid article:nth-child(3) .step-number { color: #dec5ff; background: #493064; border-color: #8e6cb6; }
.pricing { background: linear-gradient(145deg, #15253b, #101a2b 65%); border-block: 1px solid #ffffff10; }
.annual { color: #e1c794; background: #253040; border-color: #5a503c; box-shadow: none; }
.price-card { background: #17273a; color: #f4f7fb; }
.price-card:first-child { background: linear-gradient(150deg, #164238, #102d2a 70%); border-color: #3a7361; }
.price-card:first-child h3 { color: #a3ebc8; }
.price-card:first-child .outline { color: #bcf2da; background: #1b4c403d; border-color: #65ac8d; }
.price-card:last-child { background: linear-gradient(150deg, #3e2c54, #251d38 70%); border-color: #785a96; }
.price-card:last-child h3 { color: #dfc5ff; }
.price-card:last-child .outline { color: #ead5ff; background: #56387530; border-color: #a087bc; }
.price-card.recommended { background: linear-gradient(145deg, #294768, #162940 75%); border-color: #c5a25d; box-shadow: 0 12px 45px #0003; }
.price-card .plan-label, .price-card p, .price-card .price span { color: #c8d5e3; }
.price-card ul { border-color: #ffffff24; }
.price-card li:before { color: #dfc68e; }
.price-card:first-child li:before { color: #96dfb9; }
.price-card:last-child li:before { color: #cfb0f5; }
.price-card .outline:hover { background: #ffffff12; }
.price-card:hover { box-shadow: 0 20px 45px #0004; }
.recommend-label { color: #162536; }
.questions details { background: #14263a; border: 1px solid #2b4058; border-radius: 9px; padding: 16px 22px; margin-bottom: 12px; }
.questions details:nth-child(3n+2) { background: #1c2c36; border-color: #354951; }
.questions details:nth-child(3n+3) { background: #242638; border-color: #434258; }
.questions details[open] { border-color: #93815a; }
.questions summary:after { color: #e3bd76; }
.questions details p { color: #c5d2e0; }
.browser { color: #edf5f4; background: #132c2d; border-color: #6e908a; }
.browser-bar { background: #1b3038; color: #b7c9d1; border-bottom: 1px solid #ffffff18; }
.browser-bar b { color: #e0ebf0; }
.window-dots { color: #81949d; }
.profile { background: linear-gradient(145deg, #193b36, #112727 80%); }
.profile-top, .profile-caption, .profile p, .profile-bottom small { color: #bad2c9; }
.sample { border-color: #6b8e7e; background: #0b201e50; }
.profile.has-cover .monogram { background: #244c3e; color: #d5eecf; border-color: #86a17a; box-shadow: 0 0 0 6px #17322e; }
.profile-tabs { color: #c7ded3; border-color: #50796b; }
.profile-tabs span:first-child { color: #efcf91; border-bottom-color: #e3bd76; }
.profile-bottom>div { background: #1c3f38; border-color: #426a5d; }
.profile-bottom>div:nth-child(2) { background: #26372e; border-color: #50634e; }
.mini-icon { color: #d6c48f; }
.float-card { background: #244a40; border: 1px solid #588173; color: #f0f7ef; box-shadow: 0 12px 30px #0004; }
.float-card small { color: #c5dfd0; }
.float-icon { background: #345f49; color: #c9eaa7; }
.story-image { border: 1px solid #405365; box-shadow: 0 15px 40px #0003; }
@media(max-width:760px) {
  .step-grid { gap: 35px; }
  .step-number { right: auto; left: 24px; }
  .step-grid article { padding: 25px 23px 22px; }
  .questions details { padding: 14px 17px; }
}

/* Official social profiles, highlighted in the hero example and service features. */
.profile-socials { margin: 17px 0 20px; text-align: right; }
.profile-socials>strong { display: block; color: #f0dba7; font-size: 13px; font-weight: 500; margin-bottom: 10px; }
.social-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 8px; }
.social-chip { display: flex; align-items: center; justify-content: center; gap: 7px; padding: 8px 7px; border-radius: 7px; border: 1px solid #ffffff25; color: #fff; font-size: 12px; line-height: 1.7; }
.social-chip img { display: block; flex: 0 0 18px; width: 18px; height: 18px; }
.social-facebook { background: #194f96; }.social-youtube { background: #942a35; }.social-tiktok { background: #18262c; border-color: #4d938b; }.social-instagram { background: linear-gradient(130deg,#843457,#64428f); }.social-x { background: #24303f; }.social-telegram { background: #17587f; }
.profile-tabs { padding-bottom: 17px; border-bottom: 0; }.profile-tabs span:first-child { margin-bottom: -18px; padding-bottom: 16px; }
.feature.social-feature { --accent: #a7d8f5; grid-column: 1/-1; display: grid; grid-template-columns: 1.25fr 1fr; gap: 50px; align-items: center; background: linear-gradient(120deg,#1c344f,#1c2943 70%); border-color: #3d5676; }
.social-feature-demo>.social-grid { gap: 12px; }.social-feature-demo .social-chip { padding: 14px 10px; font-size: 14px; }.social-feature-demo .social-chip img { width: 22px; height: 22px; flex-basis: 22px; }.social-feature-demo>span { display: block; text-align: center; font-size: 13px; margin-top: 15px; color: #c3d1e4; }
@media(max-width:1050px){.feature.social-feature{gap:25px}.social-chip{gap:5px;padding-inline:5px}}
@media(max-width:760px){.feature.social-feature{grid-template-columns:1fr;gap:24px}.social-feature-demo .social-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:400px){.profile-socials .social-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.profile-socials .social-chip{font-size:12px}}

/* Meaningful pictograms instead of decorative numerical badges. */
.ui-icon{display:block;flex-shrink:0;filter:brightness(0) invert(1);object-fit:contain}
.feature-icon{width:56px;height:56px;border-radius:14px;background:#ffffff0d;border-color:#ffffff25;transition:background .25s,transform .25s}
.feature:hover .feature-icon{background:#ffffff1a;transform:translateY(-2px)}
.feature-icon .ui-icon{width:28px;height:28px;opacity:.94}
.step-icon{display:grid;place-items:center;width:53px;height:53px;border-radius:13px;background:#ffffff0c;border:1px solid #ffffff22;margin-bottom:18px}
.step-grid article{padding-top:26px}.step-grid h3{margin:0 0 10px}
.plan-icon{display:grid;place-items:center;width:56px;height:56px;border:1px solid #ffffff26;border-radius:15px;margin-bottom:18px;background:#ffffff0b}
.recommended .plan-icon{background:#e3bd7622;border-color:#e3bd7666}
.faq-label{display:flex;align-items:center;gap:13px}.faq-label>.ui-icon{opacity:.7;width:21px;height:21px}.faq-label>span{flex:1}
.hero-notes>span{display:inline-flex;align-items:center;gap:7px}.hero-notes .ui-icon{opacity:.78;width:17px;height:17px}
.float-icon .ui-icon{width:23px;height:23px}.menu .ui-icon{margin:auto}.form-heading{display:flex;align-items:center;gap:12px}.form-heading .ui-icon{opacity:.8}
.annual{margin-bottom:18px}.payment-promise{display:flex;align-items:center;justify-content:center;gap:13px;margin:0 auto 45px;padding:15px 24px;width:fit-content;max-width:100%;background:#13372f;border:1px solid #397960;border-radius:11px;text-align:right}
.payment-promise>.ui-icon{width:26px;height:26px;opacity:.95}.payment-promise strong{display:block;font-weight:500;color:#c0f3d3;font-size:16px}.payment-promise span{display:block;color:#bed6cd;font-size:13px;margin-top:3px}
@media(max-width:760px){.payment-promise{padding:14px 17px;margin-bottom:40px;align-items:flex-start}.payment-promise strong{font-size:15px}.payment-promise>.ui-icon{margin-top:5px}.faq-label{gap:10px}.step-icon{margin-bottom:15px}.feature-icon{width:50px;height:50px}}
@media(prefers-reduced-motion:reduce){.feature:hover .feature-icon{transform:none}}

.mission-note{display:flex;align-items:flex-start;gap:16px;padding:22px;margin:24px 0;background:linear-gradient(135deg,#153b31,#142b2d);border:1px solid #356a52;border-radius:12px}
.mission-note>.ui-icon{margin-top:5px;width:28px;height:28px;opacity:.9}.mission-note h3{margin:0 0 8px;font-size:20px;font-weight:500;color:#b6e7c6}.mission-note p{font-size:15px;line-height:1.9;margin:0;color:#c7dace}.pricing .center>p{max-width:750px;margin:10px auto;line-height:1.9}
@media(max-width:760px){.mission-note{padding:18px;gap:12px}.mission-note h3{font-size:18px}}

/* Service commitments are visible in the main narrative, before the FAQ. */
.hero-copy>p.hero-assurance{display:flex;align-items:center;gap:9px;color:#c2d7ed;font-size:13px;line-height:1.8;margin:20px 0 0}.hero-assurance .ui-icon{opacity:.85}
.mission-note .mission-audience{border-top:1px solid #ffffff1a;padding-top:13px;margin-top:14px;color:#aedcc1;font-size:13px}
.search-promise{display:grid;grid-template-columns:1.15fr 1fr;gap:55px;align-items:center;margin-top:36px;padding:42px;border:1px solid #456bb6;border-radius:16px;background:radial-gradient(ellipse at 100% 0,#204bb452,transparent 65%),#142642}
.search-story h2{margin-bottom:16px}.search-story>p{color:#c7d6ea;line-height:1.95;margin:0;max-width:560px}.search-benefits{padding:0;margin:22px 0 0;list-style:none;display:grid;gap:13px}.search-benefits li{display:flex;align-items:center;gap:11px;color:#d7e3f2;font-size:14px}.search-benefits .ui-icon{opacity:.8}
.search-guarantee{padding:30px;border-radius:12px;background:linear-gradient(145deg,#403823,#262c39);border:1px solid #b896555e}.guarantee-icon{display:grid;place-items:center;width:66px;height:66px;border:1px solid #e3bd7659;border-radius:18px;background:#e3bd7614;margin-bottom:18px}.search-guarantee .kicker{font-size:12px;margin-bottom:7px}.search-guarantee h3{font-size:27px;line-height:1.65;font-weight:500;margin:0 0 14px;color:#f4dbac}.search-guarantee p{color:#d4d8df;font-size:14px;line-height:1.95;margin:0 0 20px}.search-guarantee .inline-link{font-size:13px}
.aftercare{margin-top:32px;padding:27px 30px 30px;border:1px solid #334761;border-radius:12px;background:#112137}.aftercare-heading{display:flex;gap:12px;align-items:center;color:#d7e8ff;margin-bottom:24px}.aftercare-heading h3{font-size:20px;font-weight:500;margin:0}.care-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:28px}.care-grid article+article{border-right:1px solid #ffffff19;padding-right:28px}.care-grid article>.ui-icon{opacity:.78;margin-bottom:11px}.care-grid h4{font-size:17px;font-weight:500;color:#e4d1a9;margin:0 0 9px}.care-grid p{color:#b9c9db;font-size:14px;line-height:1.95;margin:0}
.contact-grid p.contact-assurance{display:flex;align-items:center;gap:11px;padding:13px 16px;background:#1b393c;border:1px solid #42615b;border-radius:8px;color:#c3e5d5;font-size:14px;line-height:1.8}
/* The studio preview uses one ink/navy palette; brand color stays in its icons. */
.showcase .browser{background:#101b2b;border-color:#42536a;box-shadow:0 28px 65px #0005;color:#e8edf4}
.showcase .browser-bar{background:#0d1828;color:#a8b5c7;border-bottom-color:#ffffff0d}
.showcase .browser-bar b{color:#d7dfe9}.showcase .window-dots{color:#66778d}
.showcase .profile{background:linear-gradient(155deg,#142136,#0e1827 78%)}
.showcase .profile-top,.showcase .profile-caption,.showcase .profile p{color:#a8b5c7}
.showcase .profile h2{color:#f1f0ed}
.showcase .sample{background:#ffffff04;border-color:#ffffff24;color:#b8c5d6}
.profile-cover{height:135px;object-position:50% 50%;filter:none}
.showcase .profile-cover{mask-image:linear-gradient(to bottom,#000 78%,transparent);-webkit-mask-image:linear-gradient(to bottom,#000 78%,transparent)}
.showcase .profile.has-cover .monogram{background:linear-gradient(145deg,#1d3453,#13243b);border-color:#b69b6c;color:#e8d1a6;box-shadow:0 0 0 6px #122035,0 8px 22px #0003}
.showcase .profile-socials>strong{color:#d9bd87}
.showcase .social-chip{background:#1c2a3e;border-color:#ffffff16;color:#d7dfe9;box-shadow:inset 0 1px 0 #ffffff03}
.showcase .profile-tabs{color:#a8b5c7;border-top:1px solid #ffffff0c;padding-top:13px}
.showcase .profile-tabs span:first-child{color:#d9bd87;border-bottom-color:#bda375}
.showcase .float-card{background:#132237;border-color:#394b60;color:#e8edf4}
.showcase .float-card small{color:#a8b5c7}.showcase .float-icon{background:#23364d}
.showcase .float-icon .ui-icon{filter:brightness(0) saturate(100%) invert(83%) sepia(23%) saturate(474%) hue-rotate(355deg) brightness(92%) contrast(87%)}
.showcase .orb{border-color:#7193c51f}.showcase .orb:after{border-color:#7193c50f}
.float-card{position:relative;inset:auto;width:fit-content;max-width:100%;margin:24px 0 0 auto;transform:none}.showcase:hover .float-card{transform:translateY(-3px)}
@media(max-width:1050px){.search-promise{padding:30px;gap:30px}.search-guarantee{padding:25px}.care-grid{gap:20px}.care-grid article+article{padding-right:20px}}
@media(max-width:760px){.hero-copy>p.hero-assurance{justify-content:center;font-size:12px}.search-promise{grid-template-columns:1fr;gap:27px;padding:24px;margin-top:24px}.search-guarantee{padding:24px}.search-guarantee h3{font-size:25px}.search-story>p{font-size:15px}.search-benefits li{font-size:13px}.aftercare{padding:24px}.care-grid{grid-template-columns:1fr;gap:22px}.care-grid article+article{border-right:0;border-top:1px solid #ffffff19;padding-right:0;padding-top:22px}.profile-cover{height:120px}.contact-grid p.contact-assurance{font-size:13px}}