/* hero */
.hero{position:relative;padding-block:88px 104px;overflow:clip;isolation:isolate}
.hero .photo{position:absolute;inset:0;z-index:-4}
.hero .photo img{width:100%;height:100%;object-fit:cover;object-position:center 60%;opacity:.4;filter:saturate(.6) contrast(1.05)}
.hero .tint{position:absolute;inset:0;z-index:-3;background:linear-gradient(180deg,rgba(8,18,15,.35) 0%,rgba(8,18,15,.7) 45%,var(--bg) 100%)}
.aurora{position:absolute;inset:-10%;z-index:-2;pointer-events:none;filter:blur(70px);opacity:.75}
.aurora b{position:absolute;border-radius:50%;display:block}
.aurora .a1{width:56vw;height:56vw;max-width:900px;max-height:900px;right:-8%;top:-22%;background:radial-gradient(circle,rgba(0,150,136,.65),transparent 62%);animation:aurora 16s ease-in-out infinite alternate}
.aurora .a2{width:38vw;height:38vw;max-width:620px;max-height:620px;left:-6%;bottom:-16%;background:radial-gradient(circle,rgba(95,214,194,.34),transparent 62%);animation:aurora 22s ease-in-out infinite alternate-reverse}
.hero .grain{z-index:-1}
.hero .wrap{display:grid;grid-template-columns:1.1fr .9fr;gap:56px;align-items:center;position:relative}
.hero .eyebrow{animation:rise .8s var(--ease) both}
.hero h1{margin-top:18px;color:#fff;animation:rise .9s var(--ease) .1s both}
.hero h1 em.s{color:var(--accent-2)}
.hero .lead{margin-top:24px;animation:rise .9s var(--ease) .25s both}
.boosts{display:grid;gap:12px;margin-top:32px;animation:rise .9s var(--ease) .4s both}
.boost{display:grid;grid-template-columns:52px 1fr;gap:16px;align-items:center;padding:14px 16px;border-radius:16px;background:var(--glass);border:1px solid var(--edge);transition:border-color .3s,transform .4s var(--ease)}
.boost:hover{border-color:var(--edge-2);transform:translateX(4px)}
.boost .n{width:52px;height:52px;border-radius:14px;display:grid;place-items:center;background:rgba(95,214,194,.12);border:1px solid rgba(95,214,194,.28);color:var(--accent-2);font-weight:700;font-size:var(--fs-h4);letter-spacing:-.02em}
.boost b{display:block;font-weight:600;color:#fff;font-size:var(--fs-body)}
.boost b span{color:var(--accent-2);font-weight:600;font-size:var(--fs-cap);letter-spacing:.12em;text-transform:uppercase;margin-right:8px}
.boost p{color:var(--text-2);font-size:var(--fs-sm);margin-top:2px}
.hero-trust{margin-top:24px;display:flex;flex-wrap:wrap;gap:10px 24px;font-size:var(--fs-sm);color:var(--text-2);font-weight:500;animation:rise .9s var(--ease) .55s both}
.hero-trust span{display:inline-flex;align-items:center;gap:8px}
.hero-trust i{width:16px;height:16px;border-radius:50%;background:rgba(95,214,194,.16);display:inline-grid;place-items:center}
.hero-trust i::after{content:"";width:8px;height:5px;border-left:2px solid var(--accent-2);border-bottom:2px solid var(--accent-2);transform:rotate(-45deg) translate(1px,-1px)}
/* form card */
.stage{perspective:1400px}
.form{background:linear-gradient(160deg,rgba(255,255,255,.1),rgba(255,255,255,.04));border:1px solid var(--edge-2);border-radius:var(--r-lg);backdrop-filter:blur(18px);box-shadow:0 40px 90px rgba(0,0,0,.55),0 0 80px var(--glow);padding:28px;transform:rotateY(-6deg);animation:enter 1.1s var(--ease) .3s both;transition:transform .5s var(--ease)}
.form.done{animation:none}
.stage:hover .form{transform:rotateY(0)}
.form h2{font-size:var(--fs-h3);color:#fff}
.form .sub{color:var(--text-2);font-size:var(--fs-sm);margin-top:6px}
.grid{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:20px}
.grid.three{grid-template-columns:1.4fr .8fr .8fr}
.grid+.grid{margin-top:10px}
.field{display:grid;gap:6px}
.field.full{grid-column:1/-1}
.field label{font-size:var(--fs-cap);letter-spacing:.08em;text-transform:uppercase;color:var(--text-3);font-weight:600}
.field input{width:100%;padding:13px 14px;border-radius:12px;border:1px solid var(--edge-2);background:rgba(8,18,15,.6);color:#fff;font:500 var(--fs-body) var(--sans);transition:border-color .25s,box-shadow .25s}
.field input::placeholder{color:var(--text-3)}
.field input:focus{outline:none;border-color:var(--accent-2);box-shadow:0 0 0 4px rgba(95,214,194,.18)}
.consent{display:flex;gap:10px;align-items:flex-start;margin-top:14px;font-size:var(--fs-xs);color:var(--text-2);line-height:1.5}
.consent input{margin-top:3px;accent-color:var(--accent);width:16px;height:16px;flex:0 0 16px}
.form .btn{width:100%;margin-top:16px;padding:17px}
.fine{margin-top:12px;font-size:var(--fs-cap);color:var(--text-3);text-align:center}
.thanks{text-align:center;padding:24px 8px;animation:pop .6s var(--spring) both}
.thanks .ok{width:72px;height:72px;border-radius:50%;margin:0 auto 18px;background:var(--accent-2);display:grid;place-items:center;box-shadow:0 0 0 12px rgba(95,214,194,.16)}
.thanks .ok::after{content:"";width:26px;height:14px;border-left:4px solid #04120f;border-bottom:4px solid #04120f;transform:rotate(-45deg) translate(2px,-3px)}
.thanks h2{font-size:var(--fs-h3);color:#fff}
.thanks p{color:var(--text-2);margin-top:10px;font-size:var(--fs-sm)}
.thanks p b{color:#fff}
.thanks .btn{width:auto;margin-top:18px;padding:12px 22px}
@media (max-width:920px){.hero{padding-block:56px 72px}.hero .wrap{grid-template-columns:1fr;gap:40px}.form{transform:none;animation-name:enter-flat}.stage:hover .form{transform:none}.grid.three{grid-template-columns:1fr 1fr}.grid.three .field:first-child{grid-column:1/-1}}

/* what's inside: three covers */
.inside{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:64px}
.piece{display:grid;gap:18px;justify-items:start}
.cover{width:100%;aspect-ratio:4/5;max-width:300px;border-radius:14px;position:relative;overflow:hidden;background:linear-gradient(160deg,#173d37,#0b1a17);border:1px solid var(--edge-2);box-shadow:0 30px 60px rgba(11,22,20,.28);transform:perspective(900px) rotateY(-8deg) rotateX(3deg);transition:transform .6s var(--ease),box-shadow .6s;justify-self:center}
.piece:hover .cover{transform:perspective(900px) rotateY(0) rotateX(0) translateY(-6px);box-shadow:0 44px 80px rgba(11,22,20,.34)}
.cover::before{content:"";position:absolute;inset:0;background:radial-gradient(60% 50% at 80% 0%,rgba(95,214,194,.45),transparent 60%)}
.cover::after{content:"";position:absolute;left:0;top:0;bottom:0;width:10px;background:linear-gradient(90deg,rgba(255,255,255,.12),transparent)}
.cover .k{position:absolute;left:22px;top:22px;font-size:var(--fs-cap);letter-spacing:.14em;text-transform:uppercase;color:var(--accent-2);font-weight:600}
.cover .big{position:absolute;left:22px;top:52px;font-size:64px;font-weight:700;letter-spacing:-.04em;color:#fff;line-height:1}
.cover .t{position:absolute;left:22px;right:22px;bottom:24px;color:#fff;font-weight:600;font-size:var(--fs-h4);line-height:1.2;letter-spacing:-.01em}
.cover .lines{position:absolute;left:22px;right:22px;top:140px;display:grid;gap:8px}
.cover .lines i{display:block;height:6px;border-radius:3px;background:rgba(255,255,255,.12)}
.cover .lines i:nth-child(2){width:70%}.cover .lines i:nth-child(3){width:85%}
.piece h3{color:var(--ink)}
.piece h3 span{display:block;font-size:var(--fs-cap);letter-spacing:.14em;text-transform:uppercase;color:var(--accent-deep);font-weight:600;margin-bottom:8px}
.piece p{color:var(--ink-2);font-size:var(--fs-body);max-width:34ch}
@media (max-width:920px){.inside{grid-template-columns:1fr;gap:40px}.piece{justify-items:center;text-align:center}.piece p{max-width:44ch}}

/* fit */
.fit{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-top:56px}
.col{padding:32px;border-radius:var(--r-lg);background:var(--glass);border:1px solid var(--edge)}
.col h3{color:#fff}
.col ul{list-style:none;padding:0;margin:20px 0 0;display:grid;gap:12px}
.col li{display:flex;gap:12px;align-items:flex-start;color:var(--text-2);font-size:var(--fs-body);line-height:1.5}
.col li i{width:24px;height:24px;border-radius:50%;flex:0 0 24px;margin-top:1px;display:inline-grid;place-items:center;position:relative}
.col.no li i{background:rgba(242,139,125,.14);border:1px solid rgba(242,139,125,.35)}
.col.no li i::before,.col.no li i::after{content:"";position:absolute;width:10px;height:2px;background:#f28b7d;transform:rotate(45deg)}.col.no li i::after{transform:rotate(-45deg)}
.col.yes li i{background:rgba(95,214,194,.14);border:1px solid rgba(95,214,194,.35)}
.col.yes li i::after{content:"";width:9px;height:5px;border-left:2px solid var(--accent-2);border-bottom:2px solid var(--accent-2);transform:rotate(-45deg) translate(1px,-1px)}
.col h3 em{font-family:var(--serif);font-style:italic;font-weight:400;color:var(--accent-2)}
.col.no h3 em{color:#f28b7d}
.aside-q{margin-top:24px;padding:32px 36px;border-radius:var(--r-lg);background:linear-gradient(160deg,#0f2a26,#08120f);border:1px solid var(--edge-2);display:grid;grid-template-columns:auto 1fr;gap:24px;align-items:center}
.aside-q .q{font-family:var(--serif);font-style:italic;font-size:72px;line-height:.6;color:var(--accent-2)}
.aside-q b{display:block;font-family:var(--serif);font-style:italic;font-weight:400;font-size:var(--fs-h3);color:#fff;line-height:1.3}
.aside-q p{color:var(--text-2);margin-top:10px}
.aside-q p strong{color:#fff;font-weight:600}
@media (max-width:920px){.fit{grid-template-columns:1fr}.aside-q{grid-template-columns:1fr;gap:12px}}

/* quotes */
.quotes{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:56px}
.quote{padding:32px;border-radius:var(--r-lg);background:var(--glass);border:1px solid var(--edge);backdrop-filter:blur(10px);margin:0}
.quote .q{font-family:var(--serif);font-style:italic;font-size:48px;line-height:.6;color:var(--accent-2)}
.quote p{font-size:var(--fs-lead);line-height:1.45;color:#fff;margin-top:14px;font-weight:500;letter-spacing:-.01em}
.quote footer{margin-top:20px;font-size:var(--fs-sm);color:var(--text-3);display:flex;gap:12px;align-items:center}
.quote footer b{color:#fff;display:block;font-size:var(--fs-sm);font-weight:600}
.avatar{width:32px;height:32px;border-radius:50%;display:inline-grid;place-items:center;font-size:11px;font-weight:700;color:#04120f;background:linear-gradient(135deg,#7ae3d1,#4cc7b3);flex:0 0 auto}
@media (max-width:920px){.quotes{grid-template-columns:1fr}}

/* cta */
.cta{padding-block:112px}
.cta .box{position:relative;border-radius:var(--r-xl);padding:72px 40px;text-align:center;background:linear-gradient(160deg,#0f2a26,#08120f);border:1px solid var(--edge-2);overflow:clip;animation:breathe 6s ease-in-out infinite}
.cta .box::before{content:"";position:absolute;inset:-40%;background:radial-gradient(30% 30% at 50% 100%,rgba(95,214,194,.38),transparent 60%);pointer-events:none}
.cta .box>*{position:relative}
.cta h2{color:#fff}.cta h2 em.s{color:var(--accent-2)}
.cta .lead{margin:16px auto 0;color:var(--text-2)}
.cta .btn{margin-top:28px}
.cta .fine{margin-top:16px;font-size:var(--fs-sm);color:var(--text-3)}

footer.site.slim{border-top:1px solid var(--edge);padding-block:40px 32px;font-size:var(--fs-xs);color:var(--text-3)}
footer.site.slim .wrap{display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap;align-items:center}
footer.site.slim a{color:var(--text-3);text-decoration:none}footer.site a:hover{color:#fff}
footer.site.slim nav{display:flex;gap:20px;flex-wrap:wrap}
/* mobile sticky action */
.mcta{display:none}
@media (max-width:920px){.mcta{display:block;position:fixed;left:0;right:0;bottom:0;z-index:50;padding:12px 16px calc(12px + env(safe-area-inset-bottom,0px));background:rgba(8,18,15,.85);backdrop-filter:blur(14px);border-top:1px solid var(--edge)}.mcta .btn{width:100%}body{padding-bottom:84px}}

/* ===== Elementor mapping: landing pages built from the Naamly 2026 kit ===== */
.landing-body{background:var(--bg);color:var(--text)}
.landing-body .e-con.hero{isolation:isolate;overflow:clip;padding-block:88px 104px}
.landing-body .e-con.hero>.e-con-inner{max-width:1200px}
.landing-body .hero .stage{perspective:1400px}
.landing-body .hero .form{background:linear-gradient(160deg,rgba(255,255,255,.1),rgba(255,255,255,.04));border:1px solid var(--edge-2);border-radius:var(--r-lg);backdrop-filter:blur(18px);box-shadow:0 40px 90px rgba(0,0,0,.55),0 0 80px var(--glow);padding:28px;transform:rotateY(-6deg);animation:enter 1.1s var(--ease) .3s both;transition:transform .5s var(--ease)}
.landing-body .hero .stage:hover .form{transform:rotateY(0)}
.landing-body .form .elementor-widget-heading h2,.landing-body .form h2{font-size:var(--fs-h3);color:#fff;margin:0}
.landing-body .form .sub p{color:var(--text-2);font-size:var(--fs-sm);margin:6px 0 0}
.landing-body .form .elementor-form-fields-wrapper{gap:10px;margin-top:8px}
.landing-body .form .elementor-field-group{padding:0;margin-bottom:0}
.landing-body .form .elementor-field-label{font-size:var(--fs-cap) !important;letter-spacing:.08em !important;text-transform:uppercase !important;color:var(--text-3) !important;font-weight:600 !important;padding-bottom:6px !important}
.landing-body .form .elementor-field-textual{width:100% !important;padding:13px 14px !important;border-radius:12px !important;border:1px solid var(--edge-2) !important;background:rgba(8,18,15,.6) !important;color:#fff !important;font:500 var(--fs-body) var(--sans) !important;transition:border-color .25s,box-shadow .25s !important}
.landing-body .form .elementor-field-textual::placeholder{color:var(--text-3)}
.landing-body .form .elementor-field-textual:focus{outline:none !important;border-color:var(--accent-2) !important;box-shadow:0 0 0 4px rgba(95,214,194,.18) !important}
.landing-body .form .elementor-field-type-checkbox .elementor-field-subgroup label{display:flex;gap:10px;align-items:flex-start;font-size:var(--fs-xs);color:var(--text-2);line-height:1.5}
.landing-body .form .elementor-field-type-checkbox input{margin-top:3px;accent-color:var(--accent);width:16px;height:16px;flex:0 0 16px}
.landing-body .form .elementor-field-type-submit{margin-top:8px}
.landing-body .form .elementor-button{width:100% !important;display:inline-flex !important;justify-content:center !important;align-items:center !important;gap:10px !important;padding:17px 28px !important;border-radius:999px !important;font:600 var(--fs-body) var(--sans) !important;background:linear-gradient(135deg,#25c2b0,#13988a) !important;color:#04120f !important;box-shadow:0 10px 30px var(--glow),inset 0 1px 0 rgba(255,255,255,.35) !important;border:0 !important;transition:transform .25s var(--ease) !important}
.landing-body .form .elementor-button:hover{transform:translateY(-2px) !important;color:#04120f !important}
.landing-body .form .elementor-message{font-size:var(--fs-sm);color:var(--text-2);margin-top:10px}
.landing-body .form .elementor-message-success{color:var(--accent-2)}
.landing-body .form .fine p{margin:12px 0 0;font-size:var(--fs-cap);color:var(--text-3);text-align:center}
@media (max-width:920px){.landing-body .hero .form{transform:none;animation-name:enter-flat}.landing-body .hero .stage:hover .form{transform:none}.landing-body .e-con.hero{padding-block:56px 72px}}
.landing-body .e-con.light{background:var(--paper);color:var(--ink)}
.landing-body .e-con.block{padding-block:112px}
.landing-body .e-con.marquee{padding-block:26px 28px;background:var(--bg-2);border-block:1px solid var(--edge)}
.landing-body .e-con.marquee>.e-con-inner{max-width:none;padding:0}
.landing-body .elementor-widget-html{width:100%}
.landing-body .elementor-widget-html .marquee-inner .lane{width:100%}
.landing-body .e-con.cta-s{padding-block:112px}
/* hero: background layers attach to the hero container; the copy/form row is a grid regardless of Elementor's flex settings */
.landing-body .hero .hero-bg,.landing-body .hero .hero-bg .elementor-widget-container{position:static}
.landing-body .e-con.hero>.e-con-inner{position:static}
.landing-body .e-con.hero-row{display:grid;grid-template-columns:1.1fr .9fr;gap:56px;align-items:center;width:100%}
.landing-body .e-con.hero-row>.e-con{width:auto;max-width:none;min-width:0}
.landing-body .e-con.hero-copy .elementor-widget-container>.eyebrow{margin:0}
.landing-body .e-con.hero-copy h1{margin-top:18px;color:#fff}
.landing-body .e-con.hero-copy .lead{margin-top:24px}
@media (max-width:920px){.landing-body .e-con.hero-row{grid-template-columns:1fr;gap:40px}}
.landing-body .e-con.block.love-s{padding-top:0}
.landing-body .e-con.marquee .elementor-widget-html,.landing-body .e-con.marquee .elementor-widget-container{width:100%;max-width:100%;min-width:0}
.landing-body .marquee-inner .lane{width:100%;max-width:100%}

/* light sections and the slim header, carried over from the landing mockup */
.light{background:var(--paper);color:var(--ink)}
.light .eyebrow{color:var(--accent-deep)}.light .head h2{color:var(--ink)}.light .head h2 em.s{color:var(--accent-deep)}.light .lead{color:var(--ink-2)}
.nav-cta .site{font-size:var(--fs-sm);color:var(--text-2);text-decoration:none;margin-right:10px}.nav-cta .site:hover{color:#fff}
@media (max-width:920px){.nav-cta .site{display:none}}
.landing-body .e-con.light .elementor-widget-html{color:var(--ink)}