/* Civiltek / Taste refinement. Native CSS; existing brand and content preserved.
   Design variance 6, motion 3, density 4. Sharp architectural surfaces,
   typography-led hierarchy; product viewers keep their own interface styles. */
@font-face{font-family:Outfit;src:url('/assets/fonts/outfit-variable.ttf') format('truetype');font-style:normal;font-weight:100 900;font-display:swap}
.experience-site{--taste-accent:#14d5cf;--taste-line:#323d45;--taste-muted:#b6c2ca;font-family:Outfit,"Segoe UI",sans-serif}
.experience-site :is(h1,h2,h3){font-family:Outfit,"Segoe UI",sans-serif;text-wrap:balance;letter-spacing:-.035em}
.experience-site p{text-wrap:pretty}
.experience-site .container{width:min(1320px,92%)}
.experience-site .site-header .nav-shell{min-height:76px}
.experience-site .site-header{background:#101216f5}
.experience-site :is(.site-menu-button,.atlas-close){border-radius:4px;border-color:#50606b;transition:background .2s,color .2s}
.experience-site :is(a,button,summary):focus-visible{outline:2px solid #14d5cf;outline-offset:5px}
.experience-site .page-hero h1{font-size:clamp(2.4rem,4.5vw,4.6rem);letter-spacing:-.045em;max-width:19ch}
.experience-site .section-head h2{font-size:clamp(2rem,3.3vw,3.3rem);letter-spacing:-.035em}
.experience-site .section-head p{max-width:65ch;line-height:1.75}
.experience-site .service{padding:30px 0;border-color:#b8c7cb}
.experience-site .service h3{letter-spacing:-.025em}
.experience-site .button{min-height:46px;transition:transform .2s,background .2s}
.experience-site .button:active{transform:translateY(1px)}
.experience-site .atlas-title{font-size:clamp(2.3rem,5vw,4.8rem);letter-spacing:-.045em}
.experience-site .atlas-grid{gap:36px}
.experience-site .atlas-grid a{font-size:16px;line-height:1.5;border-color:#2a353d}
.experience-site .experience-footer{border-top:1px solid var(--taste-line);padding-top:76px}
.experience-site .footer-links{gap:12px}

/* A clear introduction, one live brand visual, then four service entrances. */
.home-experience{background:#101216}
.home-experience .home-origin.home-gateway{display:grid;grid-template-columns:minmax(0,1.55fr) minmax(0,1fr);gap:0;max-width:1440px;margin:auto;padding:62px 4% 30px;overflow:clip;background:#101216;border-bottom:0}
.home-gateway .gateway-heading{grid-column:1;position:relative;text-align:left;min-height:300px;padding:0 0 38px;align-self:center}
.home-gateway .gateway-heading .eyebrow{font-size:11px;letter-spacing:.12em;margin:0 0 25px}
.home-gateway .gateway-heading h1{font-size:clamp(42px,4.35vw,68px);font-weight:500;line-height:1.04;letter-spacing:-.052em;margin:0 0 24px;max-width:13.5em}
.home-gateway .gateway-heading>p:last-child{font-size:17px;line-height:1.65;max-width:44ch;color:#b6c2ca}
.home-gateway .gateway-space{display:contents;perspective:none}
.home-gateway .home-brand-space{inset:22px 0 auto auto;width:40%;height:340px;z-index:0;pointer-events:none}
.home-gateway .gateway-connections{display:none!important}
.home-gateway .gateway-screens{grid-column:1/-1;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));grid-template-rows:auto;gap:18px;perspective:none;align-items:start;position:relative;z-index:2}
.home-gateway .gateway-screen{grid-area:auto;transform:none!important;animation:none;border:0;border-top:1px solid #4b5a65;border-radius:0;background:#151b20;box-shadow:none;overflow:hidden;transition:background .2s,border-color .2s}
.home-gateway .gateway-screen:is(:hover,[open]){border-color:#14d5cf;background:#1a242b;box-shadow:none}
.home-gateway .gateway-screen summary,.home-gateway .gateway-screen:not([open]) summary{position:relative;display:grid;grid-template-columns:1fr 20px;gap:0 8px;align-content:start;height:265px;min-height:265px;padding:20px 16px 0;background:transparent}
.home-gateway .gateway-number{position:static;grid-column:1/-1;padding:0;margin-bottom:12px;font-size:11px;color:#9cabb5}
.home-gateway .gateway-screen summary>span:nth-child(2){grid-column:1;align-self:start}
.home-gateway .gateway-screen summary strong{font-size:18px;font-weight:500;letter-spacing:-.015em;line-height:1.2;min-height:44px}
.home-gateway .gateway-description{display:block;font-size:12px;line-height:1.4;margin-top:5px;color:#b6c2ca}
.home-gateway .gateway-screen summary>svg{grid-column:2;align-self:start;width:19px;height:19px}
.home-gateway .gateway-screen .gateway-media,.home-gateway .gateway-screen:not([open]) .gateway-media,.home-gateway .gateway-screen[open] .gateway-media{display:block!important;position:absolute;inset:auto 0 0;width:100%;height:123px;object-fit:contain;object-position:center;background:#10171c;transition:transform .4s}
.home-gateway .gateway-screen:hover .gateway-media{transform:scale(1.035)}
.home-gateway .gateway-screen nav{position:static;width:auto;padding:4px 16px 16px;background:#182229;border:0;border-radius:0;box-shadow:none}
.home-gateway .gateway-screen nav a{font-size:13px;min-height:46px;line-height:1.4;padding:10px 0;border-color:#34454f}
.home-gateway .gateway-footer{grid-column:1/-1;width:100%;max-width:none;margin:22px 0 0;font-size:12px;gap:24px;color:#b6c2ca}
.home-gateway .gateway-footer a{border:0;background:#14d5cf;color:#101216;padding:14px 18px;border-radius:3px;font-weight:600;transition:background .2s}
.home-gateway .gateway-footer a:hover{background:#85e8e3}
.home-gateway .gateway-footer a svg{color:inherit}
.home-gateway .home-motion-control{top:280px;bottom:auto;right:6%;border-radius:4px}

/* Broad chapter headlines, readable copy, then the full existing demonstrations. */
.home-experience .home-chapter-nav{border-color:#323d45}
.home-experience .home-chapter-nav.has-chapter-controller>a{font-size:13px;min-height:58px;padding-inline:25px}
.home-experience .home-area{border-top:1px solid #323d45;background:#101216}
.home-experience .home-area-heading{padding-top:96px;padding-bottom:46px}
.home-experience .home-area-heading .eyebrow{color:#aebec8;font-size:12px;letter-spacing:.025em}
.home-experience .home-area-heading .eyebrow span{color:#14d5cf;font-variant-numeric:tabular-nums}
.home-experience .home-area-heading h2{font-size:clamp(36px,4.6vw,64px);line-height:1.06;letter-spacing:-.045em;font-weight:500;max-width:20ch;margin:24px 0}
.home-experience .home-area-heading>p:last-child{font-size:19px;line-height:1.7;max-width:60ch;color:#b6c2ca}
.home-experience .home-service{padding:70px 0 84px;border-color:#2c363e}
.home-experience .home-service:before{display:none}
.home-experience .home-service-heading{display:flex;flex-direction:column;align-items:flex-start;gap:18px;margin-bottom:42px;max-width:900px}
.home-experience .home-service-heading>.eyebrow{font-size:11px;letter-spacing:.055em;color:#a9bec7}
.home-experience .home-service-heading :is(h2,h3){font-size:clamp(29px,3.15vw,44px);font-weight:500;line-height:1.13;letter-spacing:-.035em;max-width:25ch;margin:0}
.home-experience .home-service-heading>p:not(.eyebrow){font-size:17px;line-height:1.8;max-width:68ch;margin:0;color:#b6c2ca}
.home-experience .home-link{font-size:15px;font-weight:500;border-color:#507079;gap:22px;padding:12px 0;color:#e7f4f4;transition:color .2s,border-color .2s}
.home-experience .home-link:hover{color:#14d5cf;border-color:#14d5cf}
.home-experience .home-link svg{width:19px;height:19px;color:#14d5cf}
.home-experience .home-model{height:clamp(340px,43vw,600px);background:#12191f;border:1px solid #2c3b43;border-radius:4px}
.home-experience .home-cinema-pipeline{margin-top:36px;padding-top:28px;border-color:#323d45}
.home-experience .home-cinema-pipeline ol{gap:36px}
.home-experience .home-cinema-pipeline li{border-color:#405a62;padding-top:22px}
.home-experience .home-cinema-pipeline strong{font-weight:500;font-size:20px}
.home-experience .home-finale{padding:100px 0 110px;background:#151d23;border-top:1px solid #34454f}
.home-experience .home-finale h2{font-size:clamp(40px,6vw,80px);font-weight:500;letter-spacing:-.05em;max-width:17ch;line-height:1.04}
.home-experience .home-finale .home-link{margin-top:20px;font-size:19px}
@media(min-width:1100px){
 .home-experience .home-service-apps>.container{display:grid;grid-template-columns:.85fr 1.15fr;gap:60px;align-items:start}
 .home-experience .home-service-apps .home-service-heading{position:sticky;top:170px}
 .home-experience .home-service-apps .home-app-product{grid-template-columns:1fr;gap:28px}
 .home-experience .home-service-apps .home-app-story{max-width:55ch}
}
@media(max-width:1000px){
 .home-experience .home-origin.home-gateway{padding-top:42px}
 .home-gateway .gateway-heading{min-height:290px}
 .home-gateway .gateway-heading h1{font-size:46px}
 .home-gateway .home-brand-space{height:300px;top:25px}
 .home-gateway .gateway-screens{grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}
 .home-gateway .gateway-screen summary strong{min-height:0;font-size:19px}
 .home-gateway .gateway-screen summary,.home-gateway .gateway-screen:not([open]) summary{height:260px;min-height:260px}
 .home-gateway .gateway-screen .gateway-media,.home-gateway .gateway-screen:not([open]) .gateway-media,.home-gateway .gateway-screen[open] .gateway-media{height:138px}
 .home-experience .home-area-heading{padding-top:66px}
}
@media(max-width:600px){
 .experience-site .container{width:90%}
 .experience-site .site-header .nav-shell{min-height:68px;gap:16px}
 .home-experience .home-origin.home-gateway{display:block;padding:34px 5% 26px}
 .home-gateway .gateway-heading{min-height:0;padding:0}
 .home-gateway .gateway-heading .eyebrow{font-size:9px;letter-spacing:.08em;margin-bottom:20px}
 .home-gateway .gateway-heading h1{font-size:clamp(36px,9.7vw,54px);max-width:100%;margin-bottom:20px}
 .home-gateway .gateway-heading>p:last-child{font-size:15px;max-width:34ch}
 .home-gateway .home-brand-space{position:relative;inset:auto;width:100%;height:200px;margin:0;z-index:0}
 .home-gateway .home-motion-control{top:365px;right:6%;bottom:auto}
 .home-gateway .gateway-screens{gap:14px 12px;grid-template-rows:auto}
 .home-gateway .gateway-screen summary,.home-gateway .gateway-screen:not([open]) summary{height:238px;min-height:238px;padding:15px 11px 0;gap:0 5px}
 .home-gateway .gateway-screen summary strong{font-size:16px;min-height:39px}
 .home-gateway .gateway-description{font-size:11px;min-height:31px}
 .home-gateway .gateway-number{margin-bottom:9px;font-size:10px}
 .home-gateway .gateway-screen .gateway-media,.home-gateway .gateway-screen:not([open]) .gateway-media,.home-gateway .gateway-screen[open] .gateway-media{height:108px}
 .home-gateway .gateway-screen nav{padding:0 11px 12px}
 .home-gateway .gateway-screen nav a{font-size:12px;overflow-wrap:anywhere}
 .home-gateway .gateway-footer{display:flex;flex-direction:column;align-items:flex-start;gap:12px;margin-top:22px}
 .home-gateway .gateway-footer p{max-width:38ch;line-height:1.6;margin:0}
 .home-gateway .gateway-footer a{font-size:13px}
 .home-experience .home-area-heading{padding-top:55px;padding-bottom:25px}
 .home-experience .home-area-heading h2{font-size:37px;margin:20px 0}
 .home-experience .home-area-heading>p:last-child{font-size:16px}
 .home-experience .home-service{padding:38px 0 50px}
 .home-experience .home-service-heading{gap:15px;margin-bottom:28px}
 .home-experience .home-service-heading :is(h2,h3){font-size:30px}
 .home-experience .home-service-heading>p:not(.eyebrow){font-size:16px;line-height:1.75}
 .home-experience .home-link{font-size:14px;gap:12px}
 .home-experience .home-model{height:330px}
 .home-experience .home-cinema-pipeline ol{gap:24px 18px}
 .home-experience .home-cinema-pipeline strong{font-size:17px}
 .home-experience .home-finale{padding:65px 0 75px}
 .experience-site .experience-footer{padding-top:50px}
}
@media(prefers-reduced-motion:reduce){.experience-site *{scroll-behavior:auto!important}.home-gateway .gateway-screen .gateway-media,.experience-site .button,.home-experience .home-link{transition:none}}
