/* FINEWEB home v7 (26.10.2026), loaded after site.css on the home page only (body.h7).
   Editorial: one grotesk in three weights of meaning, a serif italic for the second half of headings,
   grey for everything secondary, yellow only on the main action and the live demo. */
@font-face{font-family:'Schibsted Grotesk';font-style:normal;font-weight:400 600;font-display:swap;src:url(/assets/fonts/schibsted.woff2) format('woff2')}
@font-face{font-family:'Newsreader';font-style:italic;font-weight:400;font-display:swap;src:url(/assets/fonts/newsreader-italic.woff2) format('woff2')}
.h7{--x-sans:'Schibsted Grotesk',system-ui,-apple-system,'Segoe UI',sans-serif;--x-serif:'Newsreader',Georgia,serif;--fg:#EFEDE6;--fg2:rgba(239,237,230,.66);--fg3:rgba(239,237,230,.56);--line:rgba(239,237,230,.11);--line2:rgba(239,237,230,.2);--bg:#0C0C0B;--bg2:#141413;--w:1320px;
  font-family:var(--x-sans);font-size:17px;background:var(--bg)}
.h7 h1,.h7 h2,.h7 h3{font-family:var(--x-sans);font-weight:500;letter-spacing:-.035em;line-height:1;text-wrap:balance}
.h7 em{font-family:var(--x-serif);font-style:italic;font-weight:400;letter-spacing:-.01em;color:var(--fg2)}
.h7 .wrap{padding-inline:clamp(18px,3.4vw,48px)}
.h7 .btn{font-weight:500;font-size:15.5px;padding:15px 22px;border-radius:999px}
.h7 .btn-acc,.h7 .btn-acc:hover{transform:none;box-shadow:none}
.h7 .btn-acc:hover{background:#FFF06B}
.h7 .btn-acc.pulse{animation:none}
.h7 .btn:active{transform:scale(.97)}
.x-btn-line{border:1px solid var(--line2);color:var(--fg)}
.x-btn-line:hover{border-color:var(--fg)}
.x-link{display:inline-flex;align-items:center;gap:8px;border-bottom:1px solid var(--line2);padding-bottom:3px;font-size:15.5px;color:var(--fg);transition:border-color .2s}
.x-link:hover{border-color:var(--fg)}
.x-link svg{width:16px;height:16px;flex:none}
.h7 .small{color:var(--fg3)}

/* header */
.x-top{position:sticky;top:0;z-index:50;background:rgba(12,12,11,.84);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border-bottom:1px solid var(--line)}
.x-top .wrap{display:flex;align-items:center;gap:28px;height:68px;max-width:var(--w);margin:0 auto}
.x-nav{display:flex;gap:26px;margin-left:auto;font-size:15px;color:var(--fg2)}
.x-nav a{transition:color .2s}
.x-nav a:hover{color:var(--fg)}
.h7 .lang{border-color:var(--line);font-weight:500}
.x-top .btn{padding:11px 18px;font-size:14.5px}
@media(max-width:960px){.x-nav{display:none}.h7 .lang{margin-left:auto}}
@media(max-width:520px){.x-topcta{display:none}}

/* hero */
.x-hero{max-width:var(--w);margin:0 auto;padding-top:clamp(56px,9vw,128px)}
.x-hero h1{font-size:clamp(44px,7.4vw,112px);max-width:15ch}
.x-hero-row{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:28px 64px;align-items:end;margin-top:clamp(28px,4vw,48px)}
.x-sub{font-size:clamp(17px,1.5vw,20px);line-height:1.5;color:var(--fg2);max-width:40ch}
.x-cta{display:flex;flex-wrap:wrap;align-items:center;gap:14px 24px}
.x-facts{list-style:none;display:flex;flex-wrap:wrap;margin-top:clamp(40px,5vw,64px);border-top:1px solid var(--line)}
.x-facts li{flex:1 1 190px;padding:18px 24px 0 0;font-size:15px;color:var(--fg2)}
.x-facts b{display:block;color:var(--fg);font-weight:500;font-size:clamp(20px,2vw,26px);letter-spacing:-.02em;margin-bottom:2px}
@media(max-width:860px){.x-hero-row{grid-template-columns:minmax(0,1fr)}}
@media(max-width:520px){.x-cta .btn{width:100%}}

/* sections */
.x-sec{max-width:var(--w);margin:0 auto;padding-top:clamp(96px,12vw,170px)}
.x-head{display:grid;grid-template-columns:minmax(0,3fr) minmax(0,9fr);gap:12px 48px;margin-bottom:clamp(36px,4.4vw,60px)}
.x-side{font-family:var(--x-serif);font-style:italic;font-size:20px;color:var(--fg3);padding-top:.4em}
.x-sec h2,.x-end h2{font-size:clamp(34px,5.2vw,76px)}
.x-lead{margin-top:18px;max-width:48ch;color:var(--fg2);font-size:clamp(17px,1.4vw,19px);line-height:1.5}
.x-note{margin-top:22px;font-size:14.5px;color:var(--fg3);max-width:72ch;line-height:1.55}
.x-note .x-link{margin-left:6px;font-size:14.5px}
@media(max-width:860px){.x-head{grid-template-columns:minmax(0,1fr)}.x-side{padding:0;font-size:18px}}

/* examples: picker + live site + assistant */
.h7 .stage{padding-top:clamp(96px,12vw,170px)}
.x-pick{margin-bottom:20px}
.h7 .pick-chips{display:flex;flex-wrap:wrap;gap:8px}
.h7 .pick-chips button{border:1px solid var(--line2);color:var(--fg2);font-size:14px;padding:9px 14px;font-weight:500}
.h7 .pick-chips button:hover{color:var(--fg);border-color:var(--fg2);transform:none}
.h7 .pick-chips button[aria-checked="true"]{background:var(--fg);color:var(--bg);border-color:var(--fg)}
.h7 .pick-pitch{margin-top:14px;font-size:15.5px;color:var(--fg2)}
.x-stage{display:grid;grid-template-columns:minmax(0,1.7fr) minmax(300px,.8fr);gap:24px;align-items:start}
.h7 .stage .browser{border-radius:10px;border:1px solid var(--line);box-shadow:none}
.h7 .bbar{background:#161615}
.h7 .bopen{color:var(--fg);font-weight:500}
.x-demo-tag{flex:none!important;margin-left:0!important;background:none!important;padding:0!important;font-size:11px;letter-spacing:.06em;text-transform:uppercase;color:var(--fg3)!important}
.h7 .phone{border-radius:30px;box-shadow:none;border-color:var(--line2)}
.h7 .qr button{border-color:var(--line2)}
.h7 .qr button:hover{background:rgba(239,237,230,.06);border-color:var(--fg2)}
.h7 .demo-cap{color:var(--fg3)}
@media(max-width:1000px){.x-stage{grid-template-columns:minmax(0,1fr)}.h7 .stage .demo{max-width:420px;justify-self:center}}
@media(max-width:760px){
  .h7 .pick-chips{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;margin-inline:calc(-1 * clamp(18px,3.4vw,48px));padding-inline:clamp(18px,3.4vw,48px);scroll-snap-type:x proximity}
  .h7 .pick-chips::-webkit-scrollbar{display:none}
  .h7 .pick-chips button{flex:none;scroll-snap-align:start}
  .h7 .stage .bview{aspect-ratio:16/10;height:auto}
  .h7 .stage .bview iframe,.h7 .bshield{display:none}
  .h7 .screen{height:460px}
  .h7 .bbar span#bUrl{display:none}
  .x-demo-tag{margin-left:6px!important}
  .h7 .msgs{overscroll-behavior:auto}
}
.x-index{margin-top:clamp(56px,6vw,88px)}
.x-index-h{font-size:14px;color:var(--fg3);margin-bottom:10px}
.x-index nav{border-top:1px solid var(--line);display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:48px}
.x-index a{display:grid;grid-template-columns:minmax(0,1fr) auto 18px;gap:14px;align-items:center;padding:16px 0;border-bottom:1px solid var(--line);font-size:clamp(16px,1.4vw,18px);transition:color .2s}
.x-index a span{color:var(--fg3);font-size:14.5px}
.x-index a svg{width:16px;height:16px;color:var(--fg3);transition:color .2s,transform .3s var(--ease)}
@media(hover:hover) and (pointer:fine){.x-index a:hover svg{color:var(--acc);transform:translate(2px,-2px)}}
@media(max-width:760px){.x-index nav{grid-template-columns:minmax(0,1fr)}.x-index a span{display:none}}
.x-brands{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,8fr);gap:20px 48px;align-items:center;margin-top:clamp(48px,5vw,72px);padding-top:28px;border-top:1px solid var(--line)}
.x-brands h3{font-size:19px;letter-spacing:-.015em}
.x-brands p{margin-top:6px;font-size:15px;color:var(--fg2)}
.x-brand-row{display:grid;grid-template-columns:repeat(8,minmax(0,1fr));gap:8px}
.x-brand-row img{border-radius:6px;aspect-ratio:1;object-fit:cover;width:100%}
.x-brand-row figcaption{font-size:11.5px;color:var(--fg3);margin-top:6px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
@media(max-width:860px){.x-brands{grid-template-columns:minmax(0,1fr)}.x-brand-row{grid-template-columns:repeat(4,minmax(0,1fr))}}

/* what the site does */
.x-get{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 clamp(24px,4vw,64px);margin-left:calc((100% - 48px) * .25 + 48px)}
.x-get div{padding:24px 0 28px;border-top:1px solid var(--line)}
.x-get h3{font-size:clamp(21px,1.9vw,25px);letter-spacing:-.02em;line-height:1.15}
.x-get p{margin-top:10px;color:var(--fg2);max-width:42ch;line-height:1.55}
.x-get small{display:block;margin-top:12px;font-size:13.5px;color:var(--fg3)}
@media(max-width:860px){.x-get{margin-left:0}}
@media(max-width:640px){.x-get{grid-template-columns:minmax(0,1fr)}}
.x-folds{margin-top:28px;margin-left:calc((100% - 48px) * .25 + 48px);border-top:1px solid var(--line)}
@media(max-width:860px){.x-folds{margin-left:0}}
.x-fold{border-bottom:1px solid var(--line)}
.x-fold-btn{display:flex;justify-content:space-between;align-items:center;gap:16px;width:100%;padding:20px 0;font-size:clamp(17px,1.5vw,19px);font-weight:500;text-align:left;cursor:pointer;list-style:none;color:var(--fg)}
.x-fold-btn::-webkit-details-marker{display:none}
.x-fold-btn span{font-size:24px;line-height:1;color:var(--fg3);transition:transform .25s var(--ease)}
.x-fold-btn[aria-expanded="true"] span,details[open]>.x-fold-btn span{transform:rotate(45deg)}
.h7 .try-grid{padding:4px 0 32px}
.h7 .try-form{border-radius:12px;background:var(--bg2)}
.h7 .try-form .btn{align-self:flex-start}
.h7 .lock,.h7 .sheet{border-radius:12px}
.h7 .calc-box{border-radius:12px;background:var(--bg2);border:1px solid var(--line);padding:clamp(22px,3vw,36px);margin-bottom:32px}
.h7 .calc-l h3{font-size:clamp(22px,2.2vw,30px);margin:8px 0 22px;letter-spacing:-.025em}
.x-tag{display:inline-block;font-size:12.5px;color:var(--fg2);border:1px solid var(--line2);border-radius:999px;padding:4px 10px}
.h7 .sl output,.h7 .big b{font-family:var(--x-sans);font-weight:500}
.h7 .big b{font-size:clamp(44px,5vw,68px);letter-spacing:-.04em}
.h7 .big.money b{color:var(--fg)}
.h7 .calc-r{gap:16px}

/* pricing */
.h7 .ptabs{border-radius:999px;background:transparent;border-color:var(--line);margin-bottom:clamp(28px,3vw,40px)}
.h7 .ptabs button{font:500 14.5px/1 var(--x-sans);padding:11px 16px}
.h7 .ptabs button[aria-selected="true"]{background:var(--fg);color:var(--bg)}
.x-plans{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border-top:1px solid var(--line)}
.x-plan{display:flex;flex-direction:column;padding:26px clamp(16px,2.2vw,30px) 8px 0}
.x-plan+.x-plan{border-left:1px solid var(--line);padding-left:clamp(16px,2.2vw,30px)}
.x-plan h3{font-size:20px;letter-spacing:-.015em;display:flex;align-items:baseline;gap:10px;flex-wrap:wrap}
.x-plan h3 small{font-size:12.5px;font-weight:500;color:var(--acc);letter-spacing:0}
.x-price{font-size:clamp(46px,4.6vw,66px);font-weight:500;letter-spacing:-.045em;line-height:1;margin-top:20px;font-variant-numeric:tabular-nums}
.x-price span{font-size:14px;color:var(--fg3);letter-spacing:0;margin-left:6px;font-weight:400}
.x-days{margin-top:8px;font-size:14px;color:var(--fg3)}
.x-for{margin-top:16px;color:var(--fg2);font-size:16px;line-height:1.5}
.x-plan>ul{list-style:none;margin:18px 0 6px;display:grid;gap:9px;font-size:15.5px;line-height:1.4}
.x-plan>ul li,.x-inc li{padding-left:18px;position:relative}
.x-plan>ul li::before,.x-inc li::before{content:"";position:absolute;left:0;top:.68em;width:8px;height:1px;background:var(--fg3)}
.x-inc{margin:10px 0 22px;font-size:14.5px;color:var(--fg2)}
.x-inc summary{cursor:pointer;color:var(--fg3);list-style:none;display:inline-flex;gap:6px;border-bottom:1px solid var(--line);padding-bottom:2px}
.x-inc summary::-webkit-details-marker{display:none}
.x-inc summary::after{content:"+"}
.x-inc[open] summary::after{content:"−"}
.x-inc p{margin-top:12px;color:var(--fg3)}
.x-inc ul{list-style:none;display:grid;gap:7px;margin-top:10px}
.x-plan .btn{margin-top:auto;align-self:stretch}
@media(max-width:900px){.x-plans{grid-template-columns:minmax(0,1fr)}.x-plan+.x-plan{border-left:0;padding-left:0;border-top:1px solid var(--line);margin-top:20px}.x-plan{padding-bottom:22px}}
.x-after{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:24px clamp(24px,4vw,64px);margin-top:clamp(40px,4vw,56px);padding-top:28px;border-top:1px solid var(--line)}
.x-after h3{font-size:19px;letter-spacing:-.015em}
.x-kv{list-style:none;margin-top:12px}
.x-kv li{display:flex;justify-content:space-between;gap:16px;padding:11px 0;border-bottom:1px solid var(--line);font-size:15px;color:var(--fg2)}
.x-kv li b{color:var(--fg);font-weight:500;text-align:right;white-space:nowrap}
.x-kv small{display:block;font-size:13.5px;color:var(--fg3);margin-top:2px}
.x-kv2{column-count:2;column-gap:48px}
.x-kv2 li{break-inside:avoid}
@media(max-width:760px){.x-kv2{column-count:1}.x-kv li b{white-space:normal;max-width:48%}}
.x-camp-for{font-size:14px;color:var(--fg3);margin-top:4px}
.x-camp-cols{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;margin-top:16px}
.x-camp-cols div{border-top:1px solid var(--line);padding-top:12px}
.x-camp-cols b{font-weight:500;font-size:15.5px}
.x-camp-cols p{margin-top:6px;font-size:14.5px;color:var(--fg2);line-height:1.55}
@media(max-width:860px){.x-after{grid-template-columns:minmax(0,1fr)}}
@media(max-width:520px){.x-camp-cols{grid-template-columns:minmax(0,1fr)}}
.x-extras{display:flex;flex-wrap:wrap;align-items:center;gap:10px 28px;margin-top:32px;font-size:15px;color:var(--fg2)}
.x-extras b{color:var(--fg);font-weight:500}
.x-extras .x-link{margin-left:auto}
@media(max-width:760px){.x-extras .x-link{margin-left:0}}
.x-ladder{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,300px),1fr));gap:0 clamp(20px,3vw,40px);margin-top:28px;border-top:1px solid var(--line)}
.x-rung{display:flex;flex-direction:column;gap:10px;padding:24px 0 26px;border-bottom:1px solid var(--line)}
.x-rung h3{font-size:20px;letter-spacing:-.015em;display:flex;gap:10px;align-items:baseline;flex-wrap:wrap}
.x-rung h3 small{font-size:12.5px;font-weight:500;color:var(--acc);letter-spacing:0}
.x-rung h3 small.soon{color:var(--fg3)}
.x-rung-price{font-size:15px;color:var(--fg3)}
.x-rung-price b{font-size:24px;font-weight:500;color:var(--fg);letter-spacing:-.02em}
.x-rung-price span{color:var(--fg2);margin-left:6px}
.x-rung>p{color:var(--fg2);font-size:15.5px;line-height:1.5}
.x-rung .x-ex{font-size:14.5px;color:var(--fg3)}
.x-rung .x-ex b{font-weight:500;color:var(--fg2)}
.x-rung .x-link{margin-top:auto;align-self:flex-start}
.x-psub{font-size:19px;margin-top:40px;letter-spacing:-.015em}

/* process + promises */
.x-steps{list-style:none;counter-reset:s;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:0 clamp(16px,2.4vw,32px)}
.x-steps li{counter-increment:s;border-top:1px solid var(--line2);padding-top:18px}
.x-steps li::before{content:counter(s);display:block;font-family:var(--x-serif);font-style:italic;font-size:30px;color:var(--fg3);line-height:1;margin-bottom:20px}
.x-steps b{display:block;font-weight:500;font-size:19px;letter-spacing:-.015em}
.x-steps p{margin-top:8px;font-size:15.5px;color:var(--fg2);line-height:1.5}
.x-steps small{display:block;margin-top:12px;font-size:13.5px;color:var(--fg3)}
.x-promise{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:24px clamp(16px,2.4vw,32px);margin-top:clamp(48px,6vw,80px);padding-top:28px;border-top:1px solid var(--line)}
.x-promise b{display:block;font-size:clamp(28px,2.8vw,40px);font-weight:500;letter-spacing:-.035em;line-height:1}
.x-promise span{display:block;margin-top:10px;font-size:15px;color:var(--fg2)}
@media(max-width:560px){.h7 .ptabs{border-radius:14px}}
@media(max-width:860px){.x-steps,.x-promise{grid-template-columns:repeat(2,minmax(0,1fr))}.x-steps li{margin-bottom:28px}}
@media(max-width:420px){.x-steps{grid-template-columns:minmax(0,1fr)}}

/* faq */
.x-faq{margin-left:calc((100% - 48px) * .25 + 48px);border-top:1px solid var(--line)}
.x-faq details{border-bottom:1px solid var(--line)}
.x-faq summary{list-style:none;display:flex;justify-content:space-between;gap:20px;padding:20px 0;cursor:pointer;font-size:clamp(17px,1.5vw,20px)}
.x-faq summary::-webkit-details-marker{display:none}
.x-faq summary::after{content:"+";color:var(--fg3);font-size:22px;line-height:1;transition:transform .25s var(--ease)}
.x-faq details[open] summary::after{transform:rotate(45deg)}
.x-faq p{padding:0 0 22px;color:var(--fg2);max-width:64ch;line-height:1.6}
@media(max-width:860px){.x-faq{margin-left:0}}

/* contact */
.x-end{max-width:var(--w);margin:0 auto;padding-block:clamp(110px,13vw,190px) clamp(72px,8vw,110px)}
.x-end h2{font-size:clamp(42px,7.2vw,108px);max-width:14ch}
.x-end-row{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,480px);gap:40px clamp(32px,6vw,96px);margin-top:clamp(36px,4vw,56px);align-items:start}
.x-end .x-lead{margin-top:0}
.x-contacts{display:grid;gap:10px;margin-top:22px;font-size:15.5px}
.x-contacts a{display:inline-flex;align-items:center;gap:10px;color:var(--fg2);width:max-content;max-width:100%;transition:color .2s}
.x-contacts a:hover{color:var(--fg)}
.x-contacts svg{width:18px;height:18px;flex:none}
.x-audit{margin-top:clamp(36px,4vw,56px);padding-top:24px;border-top:1px solid var(--line);max-width:46ch}
.x-audit h3{font-size:20px;letter-spacing:-.015em}
.x-audit p{margin:8px 0 18px;color:var(--fg2);font-size:15.5px;line-height:1.55}
.x-audit .btn svg{width:18px;height:18px}
.h7 form.wa input{border-radius:8px;background:transparent;font-family:var(--x-sans)}
.h7 form.wa input:focus{border-color:var(--fg)}
.h7 form.wa>label,.h7 form.wa legend{font-weight:500;color:var(--fg3)}
.h7 .chips span{font-weight:500;color:var(--fg2)}
.h7 .chips input:checked+span{background:var(--fg);border-color:var(--fg);color:var(--bg)}
.h7 .chips input:focus-visible+span{outline-color:var(--fg)}
@media(max-width:860px){.x-end-row{grid-template-columns:minmax(0,1fr)}}

/* footer + mobile bar */
.h7 footer{font-size:14px;color:var(--fg3)}
.h7 .foot b{font-weight:500;color:var(--fg2)}
.h7 .bar a{font-weight:500}

/* site.js headline word rise keeps working; the serif half fades in last */
.h7 :focus-visible{outline-color:var(--fg)}
.h7 .btn-acc:focus-visible{outline-color:var(--acc)}
@media(prefers-reduced-motion:reduce){.x-fold-btn span,.x-faq summary::after,.x-index a svg,.x-link{transition:none}}