/* Approved homepage composition, isolated from interior page layouts. */
.hero{position: relative; padding-top: 54px;}
.hero-meta{display: flex; justify-content: space-between; align-items: center; gap: 20px;}
.hero-meta > span:last-child{display: flex; align-items: center; gap: 10px; color: var(--muted); font-size: 12px;}
.hero h1{position: relative; z-index: 2; font-size: clamp(70px, 8.45vw, 126px); font-weight: 600; line-height: 1.01; letter-spacing: -0.065em; margin-top: 28px; max-width: 1250px; pointer-events: none;}
.hero h1 em{display: block; color: var(--blue);}
.hero-scene{display: grid; grid-template-columns: 0.72fr 1.5fr; gap: 20px; align-items: end; margin-top: -70px; position: relative;}
.hero-copy{align-self: start; padding: 125px 0px 50px; position: relative; z-index: 2; max-width: 320px;}
.hero-copy p{font-size: 16px; line-height: 1.8; margin-bottom: 28px;}
.hero-copy .hero-secondary{display: block; font-size: 12px; color: var(--muted); margin-top: 20px;}
.hero-copy .hero-secondary a{color: var(--ink); text-decoration: underline; text-underline-offset: 4px;}
.hero-object{position: relative; min-width: 0px; padding-bottom: 34px;}
.hero-object img{width: 100%; aspect-ratio: 1.5 / 1; object-fit: contain; mix-blend-mode: multiply; filter: brightness(1.12) contrast(1.06); mask-image: linear-gradient(90deg, transparent, rgb(0, 0, 0) 5%, rgb(0, 0, 0) 96%, transparent), linear-gradient(0deg, transparent, rgb(0, 0, 0) 12%, rgb(0, 0, 0) 85%, transparent); mask-composite: intersect;}
.hero-caption{font-size: 10px; color: var(--muted); margin: 12px 0px 0px 60px;}
.section-top{display: grid; grid-template-columns: 1fr 1fr; align-items: end; gap: 70px; margin-bottom: 46px;}
.section-top h2{font-size: clamp(38px, 4.2vw, 62px); margin-top: 20px;}
.section-top > div:last-child{max-width: 350px; justify-self: end;}
.section-top p{font-size: 16px; margin-bottom: 20px;}
.section-top .kicker{color: var(--muted);}
.applications{background: var(--ink); color: var(--paper);}
.application-grid{display: grid; grid-template-columns: 1fr 1.15fr; gap: 120px; padding-block: 88px;}
.applications .kicker{color: rgb(161, 179, 190);}
.applications h2{font-size: clamp(40px, 4.5vw, 66px); margin-top: 24px;}
.applications h2 em{color: rgb(146, 182, 255);}
.applications .lead{color: rgb(174, 188, 194); max-width: 330px; margin-top: 28px;}
.application-rows{align-self: center;}
.applications .line-link{color: white; border-color: rgb(128, 144, 150); margin-top: 24px;}
.maker{display: grid; grid-template-columns: 1.05fr 1fr; gap: 96px; align-items: center;}
.maker-photo{position: relative;}
.maker-photo img{width: 100%; height: 620px; object-fit: cover; border-radius: 2px;}
.maker-photo::after{content: ""; position: absolute; inset: 50% 0px 0px; background: linear-gradient(transparent, rgba(9, 27, 45, 0.74)); pointer-events: none;}
.maker-photo figcaption{position: absolute; bottom: 32px; left: 32px; right: 32px; color: white; z-index: 1;}
.maker-photo figcaption span{display: block; font-size: 12px; margin-bottom: 8px;}
.maker-photo strong{display: block; font-size: 84px; letter-spacing: -0.07em; font-weight: 500; line-height: 1;}
.maker-copy h2{font-size: clamp(38px, 4vw, 58px); margin: 22px 0px 28px;}
.maker-copy > p{max-width: 440px; font-size: 16px;}
.process{margin: 36px 0px 30px; padding: 0px; list-style: none;}
.process li{display: grid; grid-template-columns: 35px 1fr; gap: 20px; padding: 20px 0px; border-top: 1px solid var(--line);}
.process li > span{font-size: 11px; color: var(--muted); padding-top: 4px;}
.process h3{font-size: 19px; letter-spacing: -0.025em; line-height: 1.4; font-weight: 700;}
.process p{font-size: 14px; margin-top: 6px;}
@media (min-width: 1600px){.hero-scene{margin-top: -110px;}
.hero-copy{padding-top: 160px;}}
@media (max-width: 1150px){.hero h1{font-size: 8.7vw;}
.hero-scene{grid-template-columns: 0.8fr 1.5fr; margin-top: -30px;}
.hero-copy{padding: 90px 0px 45px;}
.hero-copy p{font-size: 15px;}
.application-grid{gap: 65px;}
.maker{gap: 56px;}
.maker-photo img{height: 620px;}
.maker-copy h2{font-size: 44px;}
.section-top{gap: 40px;}}
@media (max-width: 900px){.hero{padding-top: 36px;}
.hero h1{font-size: 9vw;}
.hero-scene{grid-template-columns: 0.8fr 1.2fr; margin-top: 0px; align-items: center;}
.hero-copy{padding: 42px 0px;}
.hero-copy p{font-size: 15px;}
.hero-copy .pill{padding: 14px 20px; gap: 20px;}
.hero-caption{margin-left: 20px;}
.section-top h2{font-size: 43px;}
.section-top > div:last-child{max-width: 270px;}
.application-grid{gap: 50px; padding-block: 64px;}
.applications h2{font-size: 44px;}
.maker{gap: 36px;}
.maker-photo img{height: 690px;}
.maker-copy h2{font-size: 38px;}
.maker-copy > p{font-size: 15px;}
.process{margin-top: 28px;}
.process li{gap: 8px; grid-template-columns: 26px 1fr;}
.process h3{font-size: 17px;}}
@media (max-width: 600px){.hero{padding-top: 30px;}
.hero-meta .kicker{font-size: 9px; letter-spacing: 0.1em; max-width: 220px;}
.hero-meta > span:last-child{font-size: 10px; gap: 7px; white-space: nowrap;}
.hero h1{font-size: clamp(43px, 11.4vw, 68px); margin-top: 28px; letter-spacing: -0.06em; line-height: 1.05;}
.hero-scene{display: flex; flex-direction: column; margin-top: 12px; gap: 0px; align-items: stretch;}
.hero-object{order: 0; width: calc(100% + 20px); margin-left: -10px; padding-bottom: 0px;}
.hero-object img{aspect-ratio: 1.65 / 1;}
.hero-caption{font-size: 9px; margin: 10px 10px 0px; max-width: 260px;}
.hero-copy{order: 1; align-self: stretch; max-width: none; padding: 32px 0px;}
.hero-copy p{font-size: 16px; line-height: 1.7; max-width: 390px; margin-bottom: 22px;}
.hero-copy .pill{width: 100%; min-height: 54px; font-size: 14px; padding-inline: 22px;}
.hero-copy .hero-secondary{font-size: 12px; margin-top: 16px; text-align: center;}
.section-top{grid-template-columns: 1fr; gap: 24px; margin-bottom: 30px;}
.section-top h2{font-size: 39px; max-width: 360px; margin-top: 16px;}
.section-top > div:last-child{max-width: none; justify-self: start;}
.section-top p{max-width: 400px; margin-bottom: 10px; font-size: 16px;}
.application-grid{grid-template-columns: 1fr; gap: 32px; padding-block: 60px;}
.applications h2{font-size: 45px; margin-top: 19px;}
.applications .lead{font-size: 16px; margin-top: 24px; max-width: 370px;}
.applications summary{min-height: 78px; font-size: 23px;}
.applications details p{padding-left: 35px; font-size: 15px;}
.maker{grid-template-columns: 1fr; gap: 38px;}
.maker-photo img{height: 380px;}
.maker-photo figcaption{left: 25px; bottom: 25px;}
.maker-photo strong{font-size: 72px;}
.maker-copy h2{font-size: 40px; margin-block: 20px 24px;}
.maker-copy > p{font-size: 16px;}
.process h3{font-size: 19px;}
.process p{font-size: 15px;}
.process li{grid-template-columns: 30px 1fr; gap: 16px;}}
#produse .section-top{grid-template-columns: 1.6fr 1fr;}
#produse .section-top h2{font-size: clamp(38px, 3.7vw, 54px);}
@media (prefers-reduced-motion: no-preference){.hero-art > img{animation: 1.1s cubic-bezier(0.22, 1, 0.36, 1) 0s 1 normal both running object-arrive;}}
@media (max-width: 600px){#produse .section-top{grid-template-columns: 1fr;}
#produse .section-top h2{font-size: 39px;}}
.benefits-band{background: rgb(237, 242, 247); border-block: 1px solid rgb(214, 224, 236);}
.benefits-list{display: grid; grid-template-columns: repeat(3, minmax(0px, 1fr)); gap: 36px; margin-block: 0px; padding-block: 29px; padding-left: 0px; list-style: none;}
.benefits-list li{display: flex; align-items: center; gap: 18px; min-width: 0px;}
.benefits-list svg{width: 27px; height: 27px; flex-shrink: 0; color: var(--blue);}
.benefits-list strong{display: block; font-size: 15px; line-height: 1.5; font-weight: 700; letter-spacing: -0.015em;}
.benefits-list p{font-size: 13px; line-height: 1.6; margin-top: 3px;}
@media (max-width: 1000px){.benefits-list{gap: 24px;}
.benefits-list li{gap: 14px;}
.benefits-list strong{font-size: 14px;}
.benefits-list p{font-size: 12px;}}
@media (max-width: 700px){.benefits-list{grid-template-columns: 1fr; gap: 0px; padding-block: 8px;}
.benefits-list li{padding-block: 20px; gap: 20px;}
.benefits-list li + li{border-top: 1px solid rgb(214, 224, 236);}
.benefits-list strong{font-size: 15px;}
.benefits-list p{font-size: 13px;}}
.hero h1 em{color: rgb(40, 89, 192);}
.hero-art{position: relative; isolation: isolate; padding-bottom: 14px; background: var(--paper);}
.hero-art::before{content: ""; position: absolute; inset: 14% 4% 17% 8%; border: 1px solid rgb(198, 213, 229); border-radius: 50%; transform: rotate(-12deg); pointer-events: none; z-index: -1;}
.hero-art > img{position: relative;}
.hero-spec{display: flex; align-items: center; gap: 14px; margin: -35px 7% 24px; color: rgb(75, 96, 114); font-size: 10px; letter-spacing: 0.12em; text-transform: uppercase; position: relative;}
.hero-spec::before,.hero-spec::after{content: ""; width: 1px; height: 10px; background: rgb(174, 190, 208);}
.hero-spec i{flex: 1 1 0%; height: 1px; background: rgb(189, 202, 215);}
.hero-caption{margin-left: 7%;}
.hero-copy .pill svg{transition: transform 0.3s;}
.hero-copy .pill:hover svg{transform: translateX(4px);}
.section-top .kicker,.maker-copy > .kicker{display: flex; align-items: center; gap: 12px;}
.section-top .kicker::before,.maker-copy > .kicker::before{content: ""; width: 24px; height: 2px; background: var(--blue);}
.applications{background: var(--navy); position: relative;}
.applications::before{content: ""; position: absolute; left: 0px; right: 0px; top: 0px; height: 1px; background: rgb(69, 98, 125);}
.application-grid{gap: 100px; align-items: center; padding-block: 90px;}
.applications .lead{font-size: 16px; max-width: 370px;}
.application-rows{border-top: 1px solid rgb(73, 96, 120);}
.application-rows details{border-bottom: 1px solid rgb(73, 96, 120); transition: background 0.25s;}
.application-rows details[open]{background: rgb(33, 59, 85);}
.application-rows summary{padding: 18px 20px; min-height: 94px; gap: 18px; font-size: 25px; justify-content: flex-start;}
.application-icon{display: grid; place-items: center; width: 42px; height: 42px; border: 1px solid rgb(96, 119, 142); border-radius: 12px; flex-shrink: 0;}
.application-icon svg{width: 23px; height: 23px; color: rgb(184, 209, 242); margin: 0px; transform: none !important;}
.application-rows summary > svg{width: 22px; height: 22px; color: rgb(197, 217, 239); margin-left: auto; transition: transform .2s;}
.application-rows details[open] summary > svg{transform: rotate(45deg);}
.application-rows details p{padding: 0px 28px 20px 80px; max-width: none; font-size: 16px; color: rgb(209, 219, 229);}
.application-link{display: flex; align-items: center; justify-content: space-between; gap: 18px; margin: 0px 28px 0px 80px; padding: 12px 0px 22px; font-size: 13px; color: rgb(255, 255, 255);}
.application-link svg{width: 20px; height: 20px; transition: transform 0.25s;}
.application-link:hover svg{transform: translateX(4px);}
.applications a:focus-visible,.applications summary:focus-visible{outline-color: rgb(219, 233, 255); outline-offset: 3px;}
.maker{grid-template-columns: 1.08fr 1fr; gap: 90px;}
.maker-story{min-width: 0px;}
.maker-collage{position: relative; padding: 0px 40px 65px 0px;}
.maker-photo{position: relative;}
.maker-photo::after{display: none;}
.maker-photo img{height: 490px; width: 100%; object-fit: cover; object-position: 58% center; border-radius: var(--radius);}
.maker-detail{position: absolute; bottom: 0px; right: 0px; width: 47%; border: 8px solid var(--paper); border-radius: 18px; background: var(--paper);}
.maker-detail img{width: 100%; height: auto; aspect-ratio: 1.15 / 1; object-fit: cover; border-radius: 10px;}
.maker-stamp{display: flex; align-items: center; gap: 24px; margin-top: 24px; padding-top: 22px; border-top: 1px solid var(--line);}
.maker-stamp strong{font-size: 48px; line-height: 1.1; font-weight: 500; letter-spacing: -0.065em; white-space: nowrap;}
.maker-stamp strong span{color: var(--blue);}
.maker-stamp p{font-size: 13px; line-height: 1.6;}
.process li{position: relative; grid-template-columns: 36px 1fr; gap: 18px; padding: 22px 0px; border-top: 0px;}
.process li + li{border-top: 1px solid var(--line);}
.process li > span{display: grid; place-items: center; align-self: start; width: 32px; height: 32px; border: 1px solid rgb(184, 200, 215); border-radius: 50%; font-size: 10px; color: rgb(56, 86, 116); padding: 0px;}
.process h3{font-size: 19px; padding-top: 2px;}
.process p{font-size: 15px;}
@media (max-width: 1150px){.application-grid{gap: 60px;}
.maker{gap: 54px;}
.maker-photo img{height: 480px;}}
@media (max-width: 1000px){.maker{grid-template-columns: 1fr; gap: 42px;}
.maker-story{max-width: 690px;}
.maker-collage{padding-right: 70px; padding-bottom: 55px;}
.maker-photo img{height: 420px;}
.maker-detail{width: 40%;}
.maker-copy h2{font-size: 48px;}
.maker-copy > p{max-width: 580px;}}
@media (max-width: 900px){.hero-spec{font-size: 8px; gap: 8px; margin-top: -20px; margin-bottom: 14px;}
.hero-caption{margin-left: 4%;}
.application-grid{gap: 38px;}
.application-rows summary{font-size: 22px; gap: 12px; padding-inline: 14px;}
.application-icon{width: 36px; height: 36px;}
.application-rows details p{padding-left: 62px; padding-right: 18px;}
.application-link{margin-left: 62px; margin-right: 18px; font-size: 12px;}}
@media (max-width: 600px){.hero-art{padding-bottom: 0px;}
.hero-art::before{inset: 8% 4% 20%;}
.hero-spec{font-size: 8px; margin: 0px 7% 20px; gap: 10px;}
.hero-caption{margin-left: 10px;}
.hero-copy{padding-top: 30px;}
.application-grid{padding-block: 60px;}
.application-rows summary{font-size: 23px; min-height: 84px; padding: 16px 12px; gap: 14px;}
.application-icon{width: 38px; height: 38px;}
.application-rows details p{padding-left: 64px; padding-right: 18px; font-size: 16px;}
.application-link{margin-left: 64px; margin-right: 18px; padding-bottom: 22px; font-size: 13px;}
.maker{gap: 34px;}
.maker-collage{padding: 0px 28px 58px 0px;}
.maker-photo img{height: 320px;}
.maker-detail{width: 48%; border-width: 6px;}
.maker-stamp{gap: 20px; margin-top: 20px; padding-top: 20px;}
.maker-stamp strong{font-size: 40px;}
.maker-stamp p{font-size: 12px;}
.maker-copy h2{font-size: 40px;}
.maker-copy > p{font-size: 16px;}
.process p{font-size: 16px;}}
@media (max-width: 360px){.maker-stamp{gap: 14px;}
.maker-stamp strong{font-size: 35px;}
.application-rows summary{font-size: 21px;}
.application-link{margin-left: 18px;}
.application-rows details p{padding-left: 18px;}}
@media (max-width: 900px){.hero-copy .hero-secondary a{display: inline-flex; align-items: center; min-height: 44px;}
.hero-caption{font-size: 12px; line-height: 1.6; max-width: none;}}
@media (max-width: 600px){.hero{padding-top: 24px;}
.hero-meta{gap: 14px; align-items: center; flex-wrap: wrap;}
.hero-meta .kicker{font-size: 10px; line-height: 1.5; letter-spacing: 0.07em; max-width: none;}
.hero-meta > span:last-child{font-size: 11px; gap: 6px;}
.hero h1{font-size: clamp(34px, 10.8vw, 60px); line-height: 1.08; letter-spacing: -0.055em; margin-top: 22px;}
.hero-scene{margin-top: 0px; gap: 0px;}
.hero-copy{order: 0; padding: 22px 0px 0px; max-width: none;}
.hero-copy p{font-size: 16px; line-height: 1.6; margin-bottom: 18px; max-width: none;}
.hero-copy .pill{min-height: 54px; font-size: 14px;}
.hero-copy .hero-secondary{font-size: 14px; line-height: 1.5; margin-top: 8px; text-align: center;}
.hero-copy .secondary-prompt{display: none;}
.hero-copy .hero-secondary a{min-height: 44px; text-underline-offset: 4px;}
.hero-object{order: 1; margin-top: 14px; padding-bottom: 28px;}
.hero-spec{display: none;}
.hero-art::before{inset: 8% 4% 11%;}
.hero-caption{font-size: 12px; line-height: 1.5; margin: 8px 10px 0px; max-width: none;}
.hero-object img{aspect-ratio: 1.7 / 1;}
.benefits-list p{font-size: 14px; line-height: 1.6;}
.benefits-list strong{font-size: 16px;}
.benefits-list li{padding-block: 18px;}
#produse .section-top h2{font-size: clamp(30px, 8.7vw, 38px); line-height: 1.1;}
.section-top{gap: 22px; margin-bottom: 28px;}
.section-top p{line-height: 1.65;}
.application-grid{padding-block: 52px; gap: 30px;}
.applications h2{font-size: clamp(31px, 9vw, 40px); line-height: 1.1;}
.applications .lead{line-height: 1.65; margin-top: 22px;}
.application-rows summary{font-size: clamp(21px, 5.8vw, 24px); line-height: 1.3; padding: 16px 14px; gap: 12px; min-height: 82px;}
.application-rows details p{padding: 0px 18px 12px; font-size: 16px; line-height: 1.65;}
.application-link{margin: 0px 18px; padding: 12px 0px 20px; min-height: 48px; font-size: 14px; line-height: 1.5;}
.maker-copy h2{font-size: clamp(32px, 9vw, 39px); line-height: 1.1;}
.maker-stamp p{font-size: 14px;}
.maker-stamp{flex-wrap: wrap;}
.maker-copy > .kicker{font-size: 10px; letter-spacing: 0.09em;}
.process li{gap: 14px; grid-template-columns: 32px minmax(0px, 1fr);}
.process h3{font-size: 18px; line-height: 1.4;}
.process p{line-height: 1.65;}}
@media (max-width: 360px){.maker-stamp{align-items: flex-start; gap: 14px;}
.maker-stamp strong{font-size: 34px;}
.maker-stamp p{font-size: 13px;}}
@media (min-width: 601px) and (max-width: 900px) and (max-height: 500px){.hero{padding-top: 18px;}
.hero h1{font-size: 42px; margin-top: 16px; line-height: 1.08;}
.hero h1 em{display: inline;}
.hero-scene{grid-template-columns: 1fr 1fr; align-items: start; gap: 24px; margin-top: 0px;}
.hero-copy{padding: 20px 0px 24px; max-width: none;}
.hero-copy p{font-size: 16px; line-height: 1.5; margin-bottom: 14px;}
.hero-copy .hero-secondary{margin-top: 8px;}
.hero-object{padding-bottom: 20px;}
.hero-spec{display: none;}
.hero-caption{font-size: 12px;}}
@media (max-width: 900px) and (prefers-reduced-motion: no-preference){.hero-art > img{animation: auto ease 0s 1 normal none running none;}
.hero-art.has-entered > img{animation: 0.65s cubic-bezier(0.22, 1, 0.36, 1) 0s 1 normal backwards running object-arrive;}
.benefits-list li.has-entered,.section-top.has-entered,.application-grid > div:first-child.has-entered,.maker-collage.has-entered,.maker-copy.has-entered{animation: 0.5s cubic-bezier(0.22, 1, 0.36, 1) 0s 1 normal backwards running mobile-arrive;}
.benefits-list li:nth-child(2).has-entered{animation-delay: 50ms;}
.benefits-list li:nth-child(3).has-entered{animation-delay: 100ms;}
.application-rows details[open] > p,.application-rows details[open] > .application-link{animation: 0.24s ease-out 0s 1 normal backwards running disclosure-arrive;}}
