/* Calm, light homepage palette. The embedded demo designs retain their own colors. */
:root{--petrol:#f4f7fa;--dark:#fff;--ivory:#18222f;--champagne:#1457ad;--muted:#546274;--line:#dce3eb}
body{background:#fff;color:#18222f}
.nav.shell{background:rgba(255,255,255,.94);color:#18222f;border-bottom-color:#dce3eb;box-shadow:0 8px 25px #14233b0b}
.nav .brand,.footer .brand{color:#18222f}
.nav nav a:hover,.text-link:hover{color:#1457ad}
.button,.draft-offer .button.light,.closing .button.light{background:#1457ad;border-color:#1457ad;color:#fff;box-shadow:none}
.button:hover,.draft-offer .button.light:hover,.closing .button.light:hover{background:#0e468e;border-color:#0e468e;color:#fff;box-shadow:0 8px 22px #1457ad26}
.button.secondary{background:#fff;border-color:#c7d2de;color:#172332}
.button.secondary:hover{background:#f3f7fb;color:#172332}
.button:focus-visible,a:focus-visible,button:focus-visible{outline-color:#1457ad}
.hero{color:#18222f}
.hero:before{background:radial-gradient(ellipse at var(--spot-x,76%) var(--spot-y,57%),#dbeaf66b,transparent 52%),radial-gradient(ellipse at 92% 45%,#e9f1f78a,transparent 48%)}
.hero h1 em,h2 em,.references-heading h2 em,.references-heading h1 em{color:#1457ad}
.hero .eyebrow,.hero .lead,.hero-draft-link,.scene-explanation{color:#536274}
.hero-stage .scene-layer img{filter:drop-shadow(0 16px 19px #26384c2b)}
.hero-stage .scene-layer:hover img,.hero-stage .scene-layer:focus-visible img{filter:drop-shadow(0 19px 22px #26384c3d)}
.ambient-floor{background:radial-gradient(ellipse at var(--floor-x,66%) 55%,#bdcee777,transparent 65%)}
.scene-label{color:#526174}
.scene-switch button{background:#fff;color:#334155;border-color:#cdd8e3}
.scene-switch button:hover,.scene-switch button[aria-pressed=true]{background:#eaf3fc;color:#164578;border-color:#9cbddd}
.hero-controls{color:#566477}
.motion-toggle{color:#465568;border-color:#ccd7e3}
.motion-toggle:hover{color:#1457ad;border-color:#1457ad}
.references{background:#fff;color:#18222f}
.references-heading p,.references .reference-card small,.references .reference-note{color:#596879}
.references .reference-domain,.references .all-references{color:#1457ad}
.reference-preview{background:#f3f6f9;border-color:#d8e0e8;box-shadow:0 12px 30px #182b4214}
.reference-card:hover .reference-preview,.reference-card:focus-visible .reference-preview{border-color:#8bb0d6;box-shadow:0 14px 32px #1457ad1a}
.design-section{background:#f6f8fa;color:#18222f;border-color:#dce3eb}
.design-section .section-heading h2 em{color:#1457ad}
.design-section .section-heading>p,.design-card-copy small,.design-note,#design-count{color:#596879}
.design-filters button{background:#fff;color:#334155;border-color:#cbd6e2}
.design-filters button:hover,.design-filters button[aria-pressed=true]{background:#e7f1fc;color:#124d99;border-color:#85afd9}
.design-search{color:#425166}
.design-search input{background:#fff;color:#18222f;border-color:#cbd6e2}
.design-search input::placeholder{color:#68788a}
.design-cover{background:#fff;border-color:#d7e0e8}
.design-cover:focus-visible{outline-color:#1457ad}
.design-card-copy p{color:#536274}
.design-open{color:#1457ad;border-bottom-color:#1457ad}
.design-open:hover{color:#0e468e;border-color:#0e468e}
#design-more{color:#1457ad;border-color:#9bb9d9}
.design-individual{background:#fff;color:#18222f;border-color:#dce3eb;box-shadow:0 12px 32px #182b420b}
.design-individual h3,.design-individual p{color:#18222f}
.design-example-notice{color:#405c7c}
.screens-section{background:#fff;color:#18222f;border-color:#dce3eb}
.screens-section .section-heading>p,.screens-grid figcaption{color:#596879}
.screens-section h2 em,.screens-grid .text-link{color:#1457ad}
.screenshot-open{background:#fff;border-color:#dce3eb;color:#18222f}
.screenshot-open:hover{border-color:#8bb0d6;box-shadow:0 12px 28px #182b4214}
.shop-promo{background:#f3f7fa;color:#18222f;border-color:#dce3eb}
.shop-promo h2 em,.shop-promo-features strong,.shop-promo-proof a{color:#1457ad}
.shop-promo-copy>p,.shop-promo-caption,.shop-promo-features span{color:#536274}
.shop-promo-copy .shop-promo-lead{color:#18222f}
.shop-promo-features li{border-color:#d6e0e9}
.shop-promo .button.outline{background:#fff;color:#18222f;border-color:#bfd0e1}
.shop-browser{background:#fff;border-color:#d8e1e9;box-shadow:0 22px 55px #182b421b}
.shop-browser-bar{background:#fff;color:#536274;border-bottom:1px solid #e1e7ed}
.shop-browser-bar small,.browser-dots{color:#566477}
.shop-promo-proof{background:#fff;border-color:#dce3eb;backdrop-filter:none}
.shop-promo-proof>span{color:#536274}
.seitenstudio{background:#fff;color:#18222f}
.seitenstudio::before{background:radial-gradient(circle,#d9e9f496,transparent 70%)}
.seitenstudio .eyebrow,.seitenstudio h2 em,.seitenstudio-features article>span{color:#1457ad}
.seitenstudio-intro>p,.seitenstudio-features p,.seitenstudio-footer p{color:#536274}
.seitenstudio-figure{border-color:#dce3eb;box-shadow:0 22px 55px #182b4214}
.seitenstudio-figure .screenshot-open span{background:#f2f6fa;color:#425166}
.seitenstudio-tour{background:#f5f8fa;color:#18222f;border-color:#dce3eb}
.seitenstudio-tour li{color:#536274}
.seitenstudio-tour li::before{color:#1457ad}
.seitenstudio-tour li strong{color:#18222f}
.seitenstudio-features article{background:#fff;border-color:#dce3eb}
.seitenstudio-footer{border-color:#dce3eb}
.seitenstudio-footer .button{background:#1457ad;color:#fff;border-color:#1457ad}
.seitenstudio-footer .button:hover{background:#0e468e;color:#fff}
.seitenstudio-footer .text-link{color:#1457ad}
.draft-offer{background:#f4f7fa;color:#18222f}
.draft-offer h2 em,.draft-offer .eyebrow,.draft-offer-steps article>span,.draft-offer-steps .draft-offer-note{color:#1457ad}
.draft-offer-grid>div>p,.draft-offer-steps p,.draft-choice p,.draft-offer .text-link{color:#536274}
.draft-offer-steps article{border-color:#dce3eb}
.draft-choice{background:#fff;border-color:#dce3eb}
.individual-offer,#cms,.faq{color:#18222f}
.individual-grid article{border-color:#b8cddd}
.individual-grid span{color:#1457ad}
.custom-functions{background:#f4f7fa;color:#18222f;border-color:#dce3eb}
.custom-functions h3 em{color:#1457ad}
.custom-functions p{color:#536274}
.technology-promise{border-color:#dce3eb}
.technology-promise>span{background:#e3f0fa;color:#1457ad}
.technology-promise strong{color:#18222f}
.service-offer,.packages{background:#f4f7fa;color:#18222f}
.service-grid article,.pricing-grid article,.detail-strip,.cms-modules article{background:#fff;border-color:#dce3eb;color:#18222f}
.service-grid article>span,.service-grid .text-link,.speed-proof strong,.module-icon,.feature-symbol{color:#1457ad}
.speed-proof span,.speed-note,.detail-strip p,.pricing-grid article p,.pricing-grid article>span{color:#536274}
.ecosystem-offer,.ecosystem-offer li,.feature-mini-grid article,.workflow-grid article,.faq details,.experience-copy hr{border-color:#dce3eb}
.feature-main,.pricing-grid .business{background:#eaf3fa;color:#18222f;border-color:#cbdde9}
.feature-main a,.pricing-grid .business>a{color:#1457ad}
.feature-main small,.feature-main p,.pricing-grid .business p,.pricing-grid .business>span{color:#536274}
.experience{background:#fff;color:#18222f}
.experience-copy,.experience-copy h3{color:#18222f}
.experience-copy p,.experience .eyebrow{color:#536274}
.closing{background:#f4f7fa;color:#18222f}
.closing h2 em,.closing .eyebrow{color:#1457ad}
.closing p,.closing .text-link{color:#536274}
.footer{color:#18222f;--footer-text-muted:#536274}
.footer .brand,.footer p,.footer .brand-legal{color:#536274}
.selenny-footer-logo{--footer-text-muted:#536274;--accent:#1457ad}
.back-to-top{background:#fff;color:#1457ad;border-color:#cbd8e5;box-shadow:0 6px 22px #182b4218}
.back-to-top:hover{background:#eaf3fc}
.keyboard-scroll-hint{background:#fff;color:#425166;border-color:#dce3eb;box-shadow:0 8px 24px #182b4214}
.keyboard-scroll-keys kbd{border-color:#9db5ce;color:#1457ad}
@media(max-width:600px){.nav nav{background:#fff;border-color:#dce3eb;box-shadow:0 16px 28px #14233b1a}}

/* Consistent registered mark in visible brand text, including large headings. */
.selenny-reg,.shop-promo .shop-brand-reg{font-size:10px;font-weight:400;line-height:0;vertical-align:super;letter-spacing:0;margin-left:.03em;white-space:nowrap}
#seitenstudio-title .selenny-reg{font-size:.32em;font-weight:550;vertical-align:super;margin-left:.035em}
/* Quiet depth for the sample-theme cards. */
.design-section{background:radial-gradient(ellipse 64% 28% at 50% 37%,#e9f0f7 0%,#f6f8fa 74%)}
.design-card{background:#fff;border:1px solid #dce4ec;border-radius:15px;overflow:hidden;box-shadow:0 20px 46px #24384c26,0 4px 13px #24384c16;transition:transform .25s ease,box-shadow .25s ease}
.design-card:hover,.design-card:focus-within{transform:translateY(-4px);box-shadow:0 23px 46px #24384c28,0 5px 12px #24384c12}
.design-card .design-cover{border:0;border-radius:0}
.design-card .design-card-copy{padding:18px 18px 21px}
/* Anthracite footer across the viewport, retaining the existing content width. */
.footer.shell{position:relative;background:#262c32;box-shadow:0 0 0 100vmax #262c32;clip-path:inset(0 -100vmax);color:#f4f6f8;--footer-text-muted:#d2dae1}
.footer .brand,.footer p,.footer .brand-legal{color:#d2dae1}
.footer .brand-legal{border-top-color:#4a535c}
.footer nav a:hover,.footer nav a:focus-visible{color:#b8d9f6}
.selenny-footer-logo{--footer-text-muted:#e5ebf0;--accent:#9fc5e5}
@media(prefers-reduced-motion:reduce){.design-card{transition:none}.design-card:hover,.design-card:focus-within{transform:none}}
/* A sharp S mark with a visible light sweep replaces the former blurred glow. */
.nav .brand{flex-wrap:nowrap;gap:7px;font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Arial,sans-serif;font-weight:800;letter-spacing:-.055em;-webkit-font-smoothing:auto}
.nav .brand::before{content:none}
.nav .brand .brand-icon{position:relative;isolation:isolate;overflow:hidden;display:grid;place-items:center;flex:0 0 32px;width:32px;height:32px;margin:0;border:1px solid #c95718;border-radius:9px;background:linear-gradient(145deg,#ffab54,#f87318 55%,#da5215);color:#fff;font:800 normal 20px/1 Arial,sans-serif;letter-spacing:-.055em;box-shadow:0 1px 2px #50270b35}
.nav .brand .brand-icon::after{content:"";position:absolute;inset:-25% auto -25% -90%;width:70%;background:linear-gradient(90deg,transparent,#ffffffbd 48%,transparent);transform:skewX(-22deg);animation:selennyHeaderShine 3.1s ease-in-out infinite;pointer-events:none}
@keyframes selennyHeaderShine{0%,12%{transform:translateX(0) skewX(-22deg)}48%,100%{transform:translateX(320%) skewX(-22deg)}}
.nav .brand .brand-word{display:inline-block;white-space:nowrap;margin:0;font-size:36px;line-height:1;font-weight:800;letter-spacing:-.055em}
.nav .brand .brand-word sup{display:inline-block;margin-left:2px;font-size:9px;font-weight:650;letter-spacing:0;vertical-align:super}
.nav .brand small{margin:0 0 0 8px}
.motion-off .nav .brand .brand-icon::after{animation:none;opacity:0}
@media(prefers-reduced-motion:reduce){.nav .brand .brand-icon::after{animation:none;opacity:0}}
.reference-preview--punk{display:grid;place-items:center;aspect-ratio:16/9;background:linear-gradient(180deg,#fff 0 55%,#255183 55% 100%)}
.reference-preview--punk img{position:relative;z-index:1;width:38%;height:70%;aspect-ratio:auto;object-fit:contain;object-position:center;transform:none}
.reference-preview--punk .reference-punk-label{position:absolute;bottom:7%;left:0;right:0;color:#fff;text-align:center;font-size:clamp(10px,1.4vw,16px);font-weight:650;letter-spacing:.04em}
.ecosystem-offer .shop-connection-link{display:inline-block;margin-left:.35em;color:#24579c;font-weight:650;text-underline-offset:3px}
.ecosystem-offer .shop-connection-link:hover,.ecosystem-offer .shop-connection-link:focus-visible{color:#123c72}
@media(max-width:600px){.nav{gap:10px}.nav .brand{font-size:26px;gap:6px}.nav .brand .brand-icon{flex-basis:27px;width:27px;height:27px;font-size:17px}.nav .brand .brand-word{font-size:26px}.nav .button.small{max-width:133px;padding:10px 9px;font-size:10px}}
@media(max-width:375px){.nav .button.small{display:none}}