/* Shared glass controls. Pre-rendered social frost avoids live full-screen blur. */
body{--cta-space:32px;--glass-fill:linear-gradient(135deg,#ffffff24,#ffffff08 52%,#c7dcff12);--glass-edge:#e5efff55;--glass-shadow:inset 0 1px 0 #ffffff38,inset 0 -1px 0 #ffffff0a,0 8px 28px #00000018}
body :is(.nav-contact,.nav-create,.system-create-button,.social-button,.founder-contact,.actions .text-button,.system-pricing .package-action .button,#mobile-nav button[data-book]),body .service-floating>:is(a,button){
 background:var(--glass-fill);color:#f6f8fb;border:1px solid var(--glass-edge);border-radius:999px;box-shadow:var(--glass-shadow);backdrop-filter:blur(10px) saturate(135%);-webkit-backdrop-filter:blur(10px) saturate(135%);text-decoration:none;line-height:1.4;transition:background .18s,border-color .18s;min-height:48px
}
body .company-footer button.footer-bottom-link{background:linear-gradient(135deg,#32577424,#3257740c);color:#253d52;border:1px solid #32577450;border-radius:999px;box-shadow:inset 0 1px 0 #fff9;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}
body .service-floating{background:linear-gradient(130deg,#253248b3,#1723357d);border-color:#e7efff50;box-shadow:inset 0 1px 0 #ffffff30,0 10px 32px #0003}
body .service-floating>:first-child{background:linear-gradient(130deg,#ffffff30,#dce7ff12);color:#fff;border-color:#e6eeff6b}
body .service-floating>:last-child{border-color:transparent;box-shadow:none;background:#ffffff06}
body .actions{margin-top:var(--cta-space);gap:16px}
body .actions+p,body .social-more{margin-top:var(--cta-space)}
body :is(.social-heading,.social-person-copy)>:is(.social-button,.actions){margin-top:var(--cta-space)}
body .social-result .social-button{margin-top:var(--cta-space)}
body .social-faq .actions{margin-top:var(--cta-space)}
body .social-card .social-button{margin-top:auto}
body .social-button{padding:16px 24px}
body :is(.social-card,.social-inclusions,.social-calculator,.social-video-choices button,.social-production-grid article,.social-shared){background:linear-gradient(140deg,#eff4ff13,#cadbff04 60%,#d7e5ff09);border:1px solid #dfeaff30;border-radius:28px;box-shadow:inset 0 1px 0 #ffffff1c}
body .social-card.recommended{background:linear-gradient(145deg,#cbbcff28,#d8eaff09);border-color:#ddd5ff8c;box-shadow:inset 0 1px 0 #fff5,0 10px 42px #0002}
body .social-badge{background:#ded5ff1c;border:1px solid #e1d7ff66;color:#f2edff}
body .social-video-choices [aria-pressed=true]{background:linear-gradient(135deg,#e0d8ff30,#e0d8ff0a);border-color:#e0d8ff99}
body .social-production-grid article{padding:28px}
body .social-section::before{display:none}
/* Crossfade a pre-blurred photograph only as Henrik enters the viewport.
   No changing full-screen backdrop filter while the film is seeking. */
body[data-department=social] .universe-backdrop::after{content:"";position:absolute;inset:0;z-index:5;background:linear-gradient(125deg,#101827b3,#14223988 60%,#131e3499),url('/company/assets/scroll-20261011/social-frost.webp') center/cover;opacity:var(--social-frost,0);pointer-events:none;will-change:opacity}
body[data-department=social] .universe-header,body[data-department=social].header-docked .universe-header{background:linear-gradient(#0a1225fa,#101a2bf2 60%,#101a2b85 82%,transparent);box-shadow:none;border-bottom:0}
/* Parent already provides the glass blur. Avoid nested live filtering. */
body .service-floating>:is(a,button){backdrop-filter:none;-webkit-backdrop-filter:none}
body #social-calc select{appearance:none;-webkit-appearance:none;display:block;box-sizing:border-box;width:100%;height:58px;min-height:58px;padding:16px 48px 16px 22px;border:1px solid #e2ecff50;border-radius:999px;background-color:#ffffff0b;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16'%3E%3Cpath d='m4 6 4 4 4-4' fill='none' stroke='%23edf2ff' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E"),linear-gradient(135deg,#ffffff16,#ffffff04);background-position:right 20px center,center;background-repeat:no-repeat;background-size:16px,100%;box-shadow:var(--glass-shadow);color:#f6f8fb;font:inherit;font-size:16px;line-height:1.4;cursor:pointer;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}
body #social-calc select option{background:#172337;color:#f6f8fb}
body #social-calc select:focus-visible{outline:2px solid #d8e4ff;outline-offset:4px}
body #social-calc label{gap:12px;color:#dae2ef;font-size:14px}
#social-calc label>span{display:flex;align-items:center;gap:10px}
#social-calc i{font-style:normal;font-size:10px;color:#adbbd3;letter-spacing:.06em}
body .social-calculator{gap:clamp(32px,5vw,72px);padding:clamp(24px,4vw,52px)}
body .social-calculator h2{font-size:clamp(36px,4.3vw,58px);margin:18px 0 20px}
body .social-result{padding:28px;border-radius:24px;background:#07122535;border:1px solid #dfeaff20}
body .social-result dl{margin:0}
body .social-result dl>div{padding:18px 0}
body .social-result .social-total{margin-top:26px}
body .social-result .eyebrow{margin:0 0 14px;font-size:11px}
body .social-fine{font-size:13px;line-height:1.65;color:#d0d9e8}
body .social-heading>p:last-child{font-size:18px;line-height:1.65;max-width:58ch}
body .social-next>p:not(.eyebrow){font-size:18px;line-height:1.65;max-width:54ch;color:#d3dce9}
.social-steps{list-style:none;padding:0;margin:28px 0 0;display:grid;gap:20px}
.social-steps li{display:flex;gap:16px;align-items:baseline}
.social-steps li>span{font-size:11px;color:#a9b8d1;font-variant-numeric:tabular-nums}
.social-steps strong{font-size:16px;font-weight:500;color:#f3f6fc}
.social-steps p{font-size:14px;line-height:1.65;color:#c8d3e5;margin-top:4px}
.social-shared{margin-top:24px;padding:24px 28px}
.social-shared h3{font-size:16px;margin:0 0 16px}
.social-shared ul{display:flex;flex-wrap:wrap;gap:12px 32px;list-style:none;padding:0;margin:0;color:#d2dcea;font-size:14px}
.social-shared li{display:flex;align-items:center;gap:10px}
.social-shared li::before{content:"";width:5px;height:5px;border-radius:50%;background:#b9cce8}
.social-details{border:1px solid #dfeaff30;border-radius:22px;margin-top:24px;background:#e0eaff08;padding:20px 24px;color:#d4deed;font-size:14px;line-height:1.65}
.social-details summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:20px;color:#f0f4fb}
.social-details summary::-webkit-details-marker{display:none}
.social-details summary::after{content:"";width:8px;height:8px;border-right:1.5px solid;border-bottom:1.5px solid;transform:rotate(45deg);flex:none}
.social-details[open] summary::after{transform:rotate(225deg)}
.social-details>p{margin-top:18px}
body .social-faq details{padding:22px 24px;margin-top:12px;border:1px solid #e0eaff26;border-radius:22px;background:#e0eaff08}
body .social-faq summary{font-size:17px}
body :is(.social-button,.nav-contact,.service-floating a,.service-floating button,.text-button):focus-visible{outline:2px solid #e0e9ff;outline-offset:5px}
@media(hover:hover){body :is(.social-button,.nav-contact,.nav-create,.system-create-button,.actions .text-button,.founder-contact,.system-pricing .package-action .button):hover,body .service-floating>:is(a,button):hover{background:linear-gradient(135deg,#ffffff38,#d8e6ff16);color:#fff;border-color:#f0f5ff99;filter:none}}
@media(max-width:700px){body{--cta-space:28px}body .social-button{min-height:52px;padding:15px 20px}body .social-next .social-button{width:100%}body .social-result{padding:22px 18px}body .social-calculator{padding:24px 18px;gap:30px}body .social-shared{padding:22px}body .social-shared ul{display:grid;gap:14px}body .social-faq details{padding:20px}body .social-production-grid article{padding:24px}body .social-calculator h2{font-size:38px}body .social-heading>p:last-child,body .social-next>p:not(.eyebrow){font-size:17px}body .service-floating>:is(a,button){backdrop-filter:none;-webkit-backdrop-filter:none}}
@media(prefers-reduced-transparency:reduce){body{--glass-fill:linear-gradient(#223147,#18253a)}body[data-department=social] .universe-backdrop::after{background:#111c30e8}body #social-calc select{background-color:#25334a}}
body .founder-contact,body .company-footer button.footer-bottom-link{margin-top:var(--cta-space)}
body[data-department=system] .system-pricing .package-action .button,body[data-department=system] .system-pricing .package-row:last-child .package-action .button{background:var(--glass-fill);color:#f6f8fb;border:1px solid var(--glass-edge);border-radius:999px;box-shadow:var(--glass-shadow)}
body dialog{border-radius:28px;background:linear-gradient(135deg,#172439ed,#0e1b30e0);border-color:#e0eaff40}
body dialog .dialog-switch button,body dialog #booking-slots button,body dialog .button{border-radius:999px;background:var(--glass-fill);border:1px solid var(--glass-edge);color:#f6f8fb;box-shadow:var(--glass-shadow)}
body dialog .dialog-switch button[aria-pressed=true],body dialog #booking-slots button[aria-pressed=true]{background:linear-gradient(135deg,#e2d9ff33,#d1e3ff12);border-color:#e1dbff99}
body dialog .dialog-content :is(input:not([type=checkbox]):not([type=radio]),select,textarea){background:#e4efff0b;border-color:#dfeaff40;border-radius:24px;box-shadow:inset 0 1px 0 #ffffff16;color:#f6f8fb}
body dialog .dialog-content select{min-height:50px;padding-right:36px}
body dialog .dialog-content option{background:#172337;color:#fff}

/* Production surfaces use separate rows and the shared spacing scale. */
body #produktion{display:grid;gap:var(--cta-space)}
body #produktion>.social-heading,body #produktion>.social-inclusions,body #produktion>.social-details{margin:0}
body #produktion .social-production-grid{grid-template-columns:minmax(0,1fr);gap:var(--cta-space)}
body #produktion .social-production-grid p{min-height:0;margin-bottom:24px}

/* Portfolio cards keep long titles inside their own surface at every width. */
body .social-video-choices{gap:16px;align-items:stretch}
body .social-video-choices button{display:flex;flex-direction:column;align-items:stretch;justify-content:flex-start;min-width:0;width:100%;padding:10px;border-radius:20px;overflow:hidden;white-space:normal}
body .social-video-choices img{width:100%;height:auto;aspect-ratio:16/10;object-fit:cover;border-radius:12px;flex:none}
body .social-video-choices span{margin:14px 4px 10px;font-size:14px;line-height:1.4;overflow-wrap:anywhere;min-width:0}
body .social-video-choices small{margin:auto 4px 4px;font-size:12px;line-height:1.5}
body .social-video-choices button:focus-visible{outline-offset:3px}
/* Compact company service introductions without imagery or decorative symbols. */
body .company-services{display:block;min-height:auto;padding-block:80px}
.company-services-heading{max-width:700px;margin-bottom:32px}
.company-services-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;max-width:1440px}
.company-service-card{display:flex;min-width:0;border:1px solid #e0eaff45;border-radius:24px;background:linear-gradient(135deg,#17253ce8,#142037cc);box-shadow:inset 0 1px 0 #ffffff20;text-decoration:none;color:#f4f7fc;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}
.company-service-copy{padding:24px;display:flex;flex-direction:column;flex:1;min-width:0}
.company-service-copy h3{font-size:26px;font-weight:400;letter-spacing:-.03em;margin:0 0 12px}
.company-service-copy p{font-size:15px;line-height:1.65;color:#cdd7e7;margin:0 0 20px}
.company-service-link{padding-top:16px;border-top:1px solid #ffffff30;margin-top:auto;font-size:13px}
.company-service-card:focus-visible{outline:2px solid #e5edff;outline-offset:5px}
@media(hover:hover){.company-service-card:hover{border-color:#e0eaff99;background:linear-gradient(135deg,#21334aed,#1a2a40df)}}
@media(max-width:950px){.company-services-grid{grid-template-columns:1fr}}
@media(max-width:700px){body .social-video-choices{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));overflow:visible;padding:0;gap:14px}body .social-video-choices button{flex:none}body .social-video-choices span{font-size:14px}body .social-player-caption h3{font-size:24px;line-height:1.25}body .company-services{padding-block:64px}.company-services-heading{margin-bottom:24px}.company-services-grid{gap:16px}.company-service-copy{padding:20px}.company-service-copy h3{font-size:23px;margin-bottom:10px}.company-service-copy p{font-size:14px;line-height:1.6;margin-bottom:16px}.company-service-link{padding-top:12px;font-size:12px}}

/* Keep the mobile action row slim after shared button styles are applied. */
@media(max-width:700px){body .service-floating>:is(a,button){min-height:40px}}
body #contact-dialog .dialog-switch{gap:8px;border:0;flex-wrap:wrap}
body #contact-dialog .dialog-switch button{padding:10px 14px!important;border:1px solid var(--dialog-edge);border-radius:999px;background:var(--dialog-field);color:var(--dialog-muted);box-shadow:none;min-height:44px}
body #contact-dialog .dialog-switch button[aria-pressed=true]{background:var(--dialog-tint);border-color:var(--dialog-accent);color:var(--dialog-ink)}
body #contact-dialog .dialog-switch button[aria-pressed=true]::after{display:none}

body[data-department=websites] .website-details{max-width:520px;margin-top:18px;padding:16px 18px;border:1px solid #354e6540;border-radius:20px;background:#fff3;color:#24313c;font-size:14px;line-height:1.65}
.website-details summary{display:flex;align-items:center;justify-content:space-between;gap:16px;cursor:pointer;list-style:none;min-height:24px}
.website-details summary::-webkit-details-marker{display:none}
.website-details summary::after{content:"";width:7px;height:7px;border-right:1.5px solid;border-bottom:1.5px solid;transform:rotate(45deg);flex:none}
.website-details[open] summary::after{transform:rotate(225deg)}
.website-details p{margin-top:16px}.website-details a{text-decoration:underline}

/* The hero hint exits before it can run beneath the fixed navigation. */
body.header-docked .discover{opacity:0;pointer-events:none}

/* Preserve the layered glass finish without repeated backdrop sampling over moving film.
   Fixed navigation keeps its single blur; scrolling surfaces use their existing tint,
   inner highlight and the pre-rendered frost behind the content. */
body #main :is(.social-button,.actions .text-button,.founder-contact,.company-service-card,.website-details,.system-create-button,.system-pricing .package-action .button),body #social-calc select,body .company-footer button.footer-bottom-link{backdrop-filter:none;-webkit-backdrop-filter:none}

.company-services-grid{grid-template-columns:repeat(2,minmax(0,1fr))}@media(max-width:700px){.company-services-grid{grid-template-columns:1fr}}
