@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,300;0,400;0,600;1,300;1,400&family=DM+Mono:wght@300;400&family=DM+Sans:wght@300;400;500&display=swap');
:root{--blue:#2f80ed;--blue-deep:#2469c8;--navy:#12345b;--paper:#fff;--ink:#263648;--muted:#718096;--line:#dbe4ef;--soft:#f4f7fb;--green:#24a36a;font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;color:var(--ink)}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:#fff;line-height:1.65}a{color:inherit;text-decoration:none}button,input{font:inherit}.wrap{width:min(1120px,calc(100% - 36px));margin:auto}.site-header{background:var(--blue);color:#fff}.nav{height:76px;display:flex;align-items:center;justify-content:space-between}.brand{display:flex;align-items:center;gap:11px;font-size:22px;font-weight:500;letter-spacing:-.02em}.logo-mark,.mini-logo{display:grid;place-items:center;transform:rotate(45deg);background:#fff;color:var(--blue);border-radius:6px;font-weight:800}.logo-mark{width:33px;height:33px}.logo-mark::first-letter,.mini-logo::first-letter{transform:rotate(-45deg)}.brand .logo-mark{line-height:33px}.navlinks{display:flex;gap:30px;align-items:center;font-size:14px}.navlinks a{opacity:.9}.navlinks a:hover{opacity:1}.github-link{border:1px solid rgba(255,255,255,.6);padding:8px 15px;border-radius:4px}.menu{display:none}.lesspass-hero{position:relative;overflow:hidden;background:var(--blue);color:#fff;min-height:620px;padding:40px 0 105px}.hero-layout{display:grid;grid-template-columns:minmax(420px,510px) 1fr;gap:112px;align-items:center;position:relative;z-index:2}.generator-shell{background:#fff;color:var(--ink);border-radius:4px;box-shadow:0 22px 50px rgba(10,44,85,.28);min-height:480px;overflow:hidden}.generator-bar{height:54px;background:#25394d;color:#fff;display:flex;align-items:center;justify-content:space-between;padding:0 20px}.mini-brand{display:flex;align-items:center;gap:9px;font-weight:600}.mini-logo{width:22px;height:22px;border-radius:4px;font-size:12px}.local-state{font-size:12px;color:#c8d5e1}.progress{display:flex;height:4px;background:#e9eef4}.progress span{flex:1}.progress span.active{background:#27a9f8}.step{display:none;padding:29px 34px 24px}.step.active{display:block;animation:slide .25s ease}@keyframes slide{from{opacity:0;transform:translateY(7px)}to{opacity:1;transform:none}}.field-icon{width:38px;height:38px;border-radius:50%;background:#eaf3fd;color:var(--blue);display:grid;place-items:center;font-weight:800;margin-bottom:14px}.field-icon.success{background:#e7f7ef;color:var(--green)}.step h2{font-size:23px;font-weight:500;letter-spacing:-.02em;margin:0 0 5px}.step>p{font-size:14px;color:#77879a;margin:0 0 19px}.field{display:block;margin:13px 0}.field>span{display:block;font-size:12px;color:#526477;font-weight:600;margin-bottom:6px}.input-with-icon{display:flex;align-items:center;border:1px solid #d3dde8;background:#fff;height:49px;transition:.2s}.input-with-icon:focus-within{border-color:var(--blue);box-shadow:0 0 0 3px rgba(47,128,237,.12)}.input-with-icon>span{width:46px;text-align:center;color:#8796a6;border-right:1px solid #e4eaf0}.input-with-icon input{border:0;outline:0;min-width:0;flex:1;padding:0 14px;background:transparent}.btn{border:0;border-radius:3px;padding:13px 18px;font-weight:600;cursor:pointer}.primary{background:var(--blue);color:#fff}.primary:hover{background:var(--blue-deep)}.secondary{background:#e9eef4;color:#506174}.full{width:100%;margin-top:15px}.grow{flex:1}.actions{display:flex;gap:10px;margin-top:18px}.status{min-height:20px;color:#c34f4f;font-size:12px}.card-note{border-top:1px solid #e7edf3;background:#f8fafc;color:#8190a0;padding:12px 20px;text-align:center;font-size:11px}.resultgrid{display:grid;gap:8px}.result{display:flex;align-items:center;justify-content:space-between;gap:12px;border:1px solid #dce4ec;padding:10px 11px}.result.featured{border-color:#8abcf5;background:#f5faff}.result label{display:block;color:#7d8a99;font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.08em}.value{font-family:ui-monospace,SFMono-Regular,Consolas,monospace;font-size:13px;word-break:break-all}.copy{border:0;background:#e8f2fd;color:var(--blue-deep);padding:7px 9px;border-radius:3px;cursor:pointer;font-size:11px;font-weight:700}.hero-copy{padding-bottom:25px}.hero-kicker{font-size:12px;letter-spacing:.18em;font-weight:700;opacity:.78}.hero-copy h1{font-size:clamp(48px,6vw,72px);line-height:.98;letter-spacing:-.055em;font-weight:300;margin:18px 0 24px}.hero-copy>p{font-size:18px;line-height:1.7;max-width:560px;color:rgba(255,255,255,.88)}.hero-points{display:flex;gap:24px;flex-wrap:wrap;margin:27px 0}.hero-points span{font-size:13px}.hero-points b{display:block;font-size:11px;opacity:.6;letter-spacing:.1em}.outline-cta{display:inline-flex;gap:20px;align-items:center;border:1px solid rgba(255,255,255,.7);padding:11px 17px;border-radius:3px;font-size:14px}.wave{position:absolute;left:-5%;right:-5%;bottom:-75px;height:145px;background:#fff;border-radius:50% 50% 0 0/100% 100% 0 0}.section{padding:82px 0}.section.alt{background:#f6f8fb;border-top:1px solid #edf1f5;border-bottom:1px solid #edf1f5}.eyebrow{color:var(--blue);font-size:11px;font-weight:700;letter-spacing:.14em;text-transform:uppercase}.sectionhead{text-align:center;max-width:700px;margin:0 auto 40px}.sectionhead h2{font-weight:400;font-size:39px;line-height:1.18;letter-spacing:-.035em;margin:9px 0}.sectionhead p{color:var(--muted)}.cards,.articlegrid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.card,.articlecard{background:#fff;border:1px solid #dfe6ee;padding:25px;box-shadow:0 6px 18px rgba(28,55,88,.04)}.card .num{color:var(--blue);font-size:28px;font-weight:300}.card h3,.articlecard h3{font-weight:500;line-height:1.3}.card p,.articlecard p{color:var(--muted);font-size:14px}.articlecard small{color:var(--blue);font-weight:700;text-transform:uppercase;letter-spacing:.08em}.page-hero{background:var(--blue);color:#fff;text-align:center;padding:72px 0 82px}.page-hero h1{font-size:clamp(40px,6vw,62px);font-weight:300;line-height:1.05;letter-spacing:-.045em;margin:0 auto 18px;max-width:900px}.page-hero p{max-width:720px;margin:auto;color:rgba(255,255,255,.86);font-size:18px}.article{width:min(760px,calc(100% - 36px));margin:auto;padding:54px 0 90px}.article .meta{text-align:center;color:#8090a0;font-size:13px;margin-bottom:38px}.article h2{font-size:30px;font-weight:500;line-height:1.25;letter-spacing:-.025em;margin:42px 0 12px}.article h3{font-weight:600}.article p,.article li{color:#47596b;font-size:17px}.article .note{border-left:4px solid var(--blue);background:#eef6ff;padding:18px 20px}.footer{background:var(--navy);color:#d8e4f0;padding:46px 0}.footgrid{display:flex;justify-content:space-between;gap:30px;flex-wrap:wrap}.footlinks{display:flex;gap:18px;flex-wrap:wrap;font-size:13px}.footer small{color:#9fb2c5}@media(max-width:850px){.hero-layout{grid-template-columns:1fr;gap:45px}.hero-copy{grid-row:1;text-align:center}.hero-copy>p{margin-left:auto;margin-right:auto}.hero-points{justify-content:center}.generator-shell{width:min(520px,100%);margin:auto}.navlinks{display:none}.menu{display:block;border:1px solid rgba(255,255,255,.55);background:transparent;color:#fff;padding:8px 12px}.cards,.articlegrid{grid-template-columns:1fr}.lesspass-hero{padding-top:20px}.section{padding:64px 0}}@media(max-width:520px){.wrap{width:min(100% - 24px,1120px)}.step{padding:25px 20px 20px}.hero-copy h1{font-size:48px}.hero-copy>p{font-size:16px}.generator-shell{min-height:0}.hero-points{gap:14px}.result{align-items:flex-start}.value{max-width:210px}}


/* Unified navigation and light generator hero */
.site-header{position:relative;z-index:50;background:#fff;color:var(--ink);border-bottom:1px solid #e5ebf2;box-shadow:0 1px 0 rgba(18,52,91,.02)}
.nav{position:relative}
.brand{color:var(--navy);font-weight:650}
.logo-mark{background:var(--blue);color:#fff}
.navlinks a{color:#465a6f;opacity:1;transition:color .2s ease,background-color .2s ease,border-color .2s ease}
.navlinks a:hover{color:var(--blue)}
.github-link{border-color:#cbd7e4;color:var(--navy)!important}
.github-link:hover{border-color:var(--blue);background:#f3f8ff}
.menu{width:44px;height:42px;padding:0;border:0;background:transparent;display:none;align-items:center;justify-content:center;flex-direction:column;gap:5px;border-radius:6px;cursor:pointer}
.menu span{display:block;width:23px;height:2px;background:var(--navy);border-radius:99px;transition:transform .28s ease,opacity .2s ease}
.menu[aria-expanded="true"] span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.menu[aria-expanded="true"] span:nth-child(2){opacity:0}
.menu[aria-expanded="true"] span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
.lesspass-hero{background:#fff;color:var(--ink);padding-top:72px;border-bottom:1px solid #edf1f5}
.hero-copy{color:var(--ink)}
.hero-kicker{color:var(--blue);opacity:1}
.hero-copy h1{color:var(--navy)}
.hero-copy h1 br{display:block}
.hero-copy>p{color:#52677d}
.hero-points span{color:#40546a}
.hero-points b{color:var(--blue);opacity:1}
.outline-cta{border-color:#a9c9ef;color:var(--blue-deep);background:#f7fbff;transition:background .2s ease,border-color .2s ease}
.outline-cta:hover{background:#edf6ff;border-color:var(--blue)}
.wave{display:none}
.generator-shell{box-shadow:0 22px 55px rgba(32,72,116,.16);border:1px solid #dbe5ef}
@media(max-width:850px){
  .nav{height:68px}
  .menu{display:flex;position:relative;z-index:52}
  .navlinks{display:flex;position:absolute;top:calc(100% + 1px);left:0;right:0;z-index:51;flex-direction:column;align-items:stretch;gap:0;padding:8px;background:#fff;border:1px solid #dfe7ef;border-top:0;border-radius:0 0 10px 10px;box-shadow:0 18px 34px rgba(18,52,91,.14);opacity:0;visibility:hidden;transform:translateY(-10px) scaleY(.96);transform-origin:top;pointer-events:none;transition:opacity .24s ease,transform .24s ease,visibility .24s ease}
  .navlinks.open{opacity:1;visibility:visible;transform:translateY(0) scaleY(1);pointer-events:auto}
  .navlinks a{display:block;padding:13px 14px;border-radius:6px;font-size:15px}
  .navlinks a:hover{background:#f3f7fb}
  .github-link{border:0;padding:13px 14px}
  .hero-layout{grid-template-columns:1fr;gap:54px}
  .generator-shell{grid-row:1;width:min(520px,100%);margin:auto}
  .hero-copy{grid-row:2;text-align:center;padding-bottom:0}
  .hero-copy>p{margin-left:auto;margin-right:auto}
  .hero-points{justify-content:center}
  .lesspass-hero{padding:30px 0 76px}
}
@media(max-width:520px){
  .wrap{width:min(100% - 24px,1120px)}
  .lesspass-hero{padding-top:22px}
  .generator-shell{width:100%;border-radius:6px}
  .hero-copy{padding-top:2px}
  .hero-copy h1{font-size:42px}
}


/* Responsive AdSense placements */
.ad-placement{width:100%;margin:42px auto;padding:18px 0;border-top:1px solid #e5ebf2;border-bottom:1px solid #e5ebf2;min-height:120px;overflow:hidden;text-align:center;background:#fff}
.ad-label{margin:0 0 10px;color:#8a98a8;font-size:10px;font-weight:600;letter-spacing:.12em;text-transform:uppercase}
.ad-placement .adsbygoogle{width:100%;min-height:90px}
@media(max-width:520px){.ad-placement{margin:32px auto;padding:14px 0;min-height:110px}.ad-placement .adsbygoogle{min-height:80px}}


/* Full-viewport mobile navigation */
@media(max-width:850px){
  .site-header{overflow:visible}
  .navlinks{
    left:50%;
    right:auto;
    width:100vw;
    margin-left:-50vw;
    padding:10px 12px 14px;
    border-left:0;
    border-right:0;
    border-radius:0 0 12px 12px;
    transform:translateY(-10px);
  }
  .navlinks.open{transform:translateY(0)}
  .navlinks a{width:100%;padding:14px 16px}
}


/* Homepage FAQ */
.faq-section{background:#fff;border-top:1px solid #edf1f5}.faq-list{width:min(820px,100%);margin:0 auto;border-top:1px solid #dfe7ef}.faq-item{border-bottom:1px solid #dfe7ef;background:#fff}.faq-item summary{list-style:none;display:flex;align-items:center;justify-content:space-between;gap:20px;padding:21px 4px;cursor:pointer;color:var(--navy);font-size:18px;font-weight:600}.faq-item summary::-webkit-details-marker{display:none}.faq-item summary span{flex:0 0 auto;width:30px;height:30px;border:1px solid #cbd8e6;border-radius:50%;display:grid;place-items:center;color:var(--blue);font-size:21px;font-weight:400;transition:transform .25s ease,background .25s ease}.faq-item[open] summary span{transform:rotate(45deg);background:#eef6ff}.faq-answer{overflow:hidden}.faq-answer p{margin:0;padding:0 48px 22px 4px;color:#52677d;font-size:16px;line-height:1.75}@media(max-width:520px){.faq-item summary{padding:18px 0;font-size:16px}.faq-answer p{padding:0 40px 19px 0;font-size:15px}}


/* AdSense approval trust upgrade */

.trust-strip{padding:18px 0;border-bottom:1px solid #e4ebf2;background:#f8fbff}.trust-strip .wrap{display:flex;justify-content:space-between;gap:18px;align-items:center;flex-wrap:wrap}.trust-strip p{margin:0;color:#4c6278;font-size:14px}.trust-strip strong{color:var(--navy)}.editorial-intro{max-width:820px;margin:0 auto;text-align:left}.editorial-intro p{font-size:17px;line-height:1.85;color:#475d72}.about-summary{display:grid;grid-template-columns:96px 1fr;gap:24px;align-items:center;max-width:820px;margin:0 auto}.about-summary img{width:96px;height:96px;border-radius:50%;border:1px solid #dce6ef}.about-summary h2{margin:0 0 8px;font-size:30px;font-weight:500}.about-summary p{margin:0;color:#52677d}.about-summary .location{display:block;margin-top:8px;color:var(--blue-deep);font-size:14px;font-weight:650}.privacy-primary{font-weight:750;color:#fff!important;text-decoration:underline;text-underline-offset:4px}.cookie-settings-link{border:1px solid #536a80;background:transparent;color:#d8e4f0;border-radius:4px;padding:9px 12px;cursor:pointer;font:inherit;font-size:13px}.cookie-settings-link:hover{border-color:#fff;color:#fff}.operator-card{display:grid;grid-template-columns:160px 1fr;gap:30px;align-items:center;background:#f6f9fc;border:1px solid #dfe7ef;padding:28px;margin:12px 0 36px}.operator-card img{width:160px;height:160px;border-radius:18px}.operator-card h2{margin-top:0}.contact-card{background:#f6f9fc;border:1px solid #dfe7ef;padding:25px;margin:25px 0}.contact-card a{color:var(--blue-deep);font-weight:700}.article-meta-box{display:flex;justify-content:center;gap:10px 18px;flex-wrap:wrap;color:#748698;font-size:13px;margin:-20px auto 38px}.article-meta-box span+span:before{content:'•';margin-right:18px;color:#a6b3bf}.filterbar{display:flex;gap:9px;flex-wrap:wrap;justify-content:center;margin:0 auto 30px}.filter-btn{border:1px solid #cfdbe7;background:#fff;color:#4d6277;border-radius:999px;padding:9px 14px;cursor:pointer;font-weight:650}.filter-btn.active,.filter-btn:hover{background:var(--blue);border-color:var(--blue);color:#fff}.articlecard[hidden]{display:none}.blog-count{text-align:center;color:#718397;margin:-15px 0 28px}.policy-actions{display:flex;gap:10px;flex-wrap:wrap;margin:22px 0}.consent-backdrop{position:fixed;inset:0;z-index:9999;background:rgba(11,28,48,.62);display:flex;align-items:flex-end;justify-content:center;padding:20px}.consent-panel{width:min(720px,100%);background:#fff;border-radius:12px;padding:28px;box-shadow:0 25px 80px rgba(0,0,0,.3)}.consent-panel h2{margin:7px 0 10px;color:var(--navy);font-size:28px}.consent-panel p{color:#52677d;line-height:1.65}.consent-actions{display:flex;gap:10px;flex-wrap:wrap;margin:20px 0 8px}.text-button{background:transparent;color:#445d75;border:1px solid #cad6e2}.consent-small{font-size:12px}.consent-small a{color:var(--blue-deep);font-weight:700}.consent-open{overflow:hidden}.ad-placement:before{content:'Advertising loads only after consent';display:block;color:#9aa8b5;font-size:11px;margin-bottom:8px}.ad-placement:has(ins[data-loaded="true"]):before{display:none}.last-updated{font-size:13px;color:#6f8295}.legal-list li{margin-bottom:10px}.address-highlight{display:inline-block;background:#eef6ff;border:1px solid #cfe3fa;padding:10px 14px;color:var(--blue-deep);font-weight:700}.contact-methods{display:grid;grid-template-columns:repeat(2,1fr);gap:18px;margin:28px 0}.contact-method{border:1px solid #dfe7ef;padding:22px;background:#fff}.contact-method h2{margin-top:0;font-size:23px}.contact-method a{color:var(--blue-deep);font-weight:700;word-break:break-word}@media(max-width:650px){.about-summary,.operator-card{grid-template-columns:1fr;text-align:center}.about-summary img,.operator-card img{margin:auto}.operator-card{padding:22px}.contact-methods{grid-template-columns:1fr}.consent-actions{flex-direction:column}.consent-actions .btn{width:100%}.article-meta-box span+span:before{display:none}.article-meta-box{flex-direction:column;align-items:center;gap:4px}}

/* Footer trust placement */
.footer .trust-strip{
  margin:-46px 0 36px;
  padding:18px 0;
  border:0;
  border-bottom:1px solid rgba(255,255,255,.12);
  background:rgba(255,255,255,.035);
}
.footer .trust-strip .wrap{width:min(1120px,calc(100% - 36px))}
.footer .trust-strip p{color:#b8c8d8}
.footer .trust-strip strong{color:#fff}
.footer .trust-strip .last-updated{color:#91a7bc}

/* Borderless FAQ controls */
.faq-section{border-top:0}
.faq-list{border-top:0}
.faq-item{border-bottom:0;margin-bottom:8px}
.faq-item summary{
  padding:19px 0;
  border-bottom:1px solid #edf1f5;
}
.faq-item summary span{
  width:auto;
  height:auto;
  border:0;
  border-radius:0;
  background:transparent;
  color:var(--blue);
  font-size:25px;
  line-height:1;
  font-weight:300;
}
.faq-item[open] summary span{background:transparent;transform:rotate(45deg)}

/* Compact animated cookie consent bar */
.consent-backdrop{
  position:fixed;
  inset:auto 0 0;
  z-index:9999;
  display:flex;
  justify-content:center;
  padding:0 14px 14px;
  background:transparent;
  pointer-events:none;
  opacity:0;
  transform:translateY(22px);
  transition:opacity .22s ease,transform .22s ease;
}
.consent-backdrop.is-visible{opacity:1;transform:none}
.consent-backdrop.is-closing{opacity:0;transform:translateY(22px)}
.consent-panel{
  width:min(980px,100%);
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  align-items:center;
  gap:18px 28px;
  padding:16px 18px;
  border:1px solid #dfe6ee;
  border-radius:8px;
  background:#fff;
  box-shadow:0 14px 42px rgba(18,52,91,.18);
  pointer-events:auto;
}
.consent-copy h2{margin:0 0 2px;color:var(--navy);font-size:15px;font-weight:700}
.consent-copy p{margin:0;color:#607286;font-size:12px;line-height:1.45}
.consent-copy a{color:var(--blue-deep);font-weight:700}
.consent-main-actions{display:flex;align-items:center;gap:9px;white-space:nowrap}
.consent-main-actions button,.consent-manage button{
  min-height:36px;
  border-radius:4px;
  padding:8px 13px;
  cursor:pointer;
  font:inherit;
  font-size:12px;
  font-weight:700;
}
.consent-link-button{border:1px solid #cbd8e6;background:#fff;color:var(--blue-deep)}
.consent-accept{border:1px solid var(--blue);background:var(--blue);color:#fff}
.consent-manage{
  grid-column:1/-1;
  display:flex;
  justify-content:flex-end;
  gap:8px;
  padding-top:12px;
  border-top:1px solid #edf1f5;
  animation:consentChoices .2s ease;
}
.consent-manage[hidden]{display:none}
.consent-manage button{border:1px solid #cbd8e6;background:#f8fafc;color:#4c6278}
@keyframes consentChoices{from{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:none}}
@media(max-width:650px){
  .footer .trust-strip{margin:-46px 0 30px}
  .footer .trust-strip .wrap{width:min(100% - 24px,1120px);display:block;text-align:center}
  .footer .trust-strip p+p{margin-top:5px}
  .consent-backdrop{padding:0 8px 8px}
  .consent-panel{grid-template-columns:1fr;gap:12px;padding:14px;border-radius:7px}
  .consent-main-actions{width:100%;justify-content:flex-end}
  .consent-main-actions button{flex:1}
  .consent-manage{justify-content:stretch;flex-direction:column}
  .consent-manage button{width:100%}
}
@media(prefers-reduced-motion:reduce){
  .consent-backdrop,.consent-manage,.faq-item summary span{animation:none!important;transition:none!important}
}

/* Homepage hero vertical position */
.lesspass-hero{padding-top:118px}
@media(max-width:850px){.lesspass-hero{padding-top:64px}}
@media(max-width:520px){.lesspass-hero{padding-top:48px}}

/* Full-screen centered homepage hero */
.home .lesspass-hero{
  min-height:calc(100svh - 76px);
  padding:32px 0;
  display:flex;
  align-items:center;
  justify-content:center;
  overflow:hidden;
}
.home .lesspass-hero .hero-layout{
  width:min(1120px,calc(100% - 36px));
  margin:0 auto;
  align-items:center;
}
.home .lesspass-hero + .section{
  margin-top:0;
}
@media(max-width:850px){
  .home .lesspass-hero{
    min-height:calc(100svh - 68px);
    padding:34px 0 48px;
    align-items:flex-start;
    overflow:visible;
  }
  .home .lesspass-hero .hero-layout{
    width:min(100% - 24px,1120px);
  }
  .home .generator-shell{
    min-height:calc(100svh - 150px);
    display:flex;
    flex-direction:column;
    justify-content:center;
  }
  .home .generator-bar,
  .home .progress,
  .home .card-note{flex:0 0 auto}
  .home .step.active{flex:1;display:flex;flex-direction:column;justify-content:center}
}
@media(max-width:520px){
  .home .lesspass-hero{
    padding:22px 0 42px;
  }
  .home .generator-shell{
    min-height:calc(100svh - 112px);
  }
}


/* Language selector — keeps all navigation controls together on the right */
.language-switcher{
  position:relative;
  display:inline-flex;
  align-items:center;
  gap:7px;
  min-width:112px;
  color:#465a6f;
  white-space:nowrap;
}
.language-switcher__globe{
  width:17px;
  height:17px;
  flex:0 0 auto;
  color:currentColor;
  pointer-events:none;
}
.language-switcher__select{
  appearance:none;
  -webkit-appearance:none;
  min-width:82px;
  border:0;
  outline:0;
  background:transparent;
  color:inherit;
  padding:8px 22px 8px 0;
  font:inherit;
  font-size:14px;
  font-weight:600;
  cursor:pointer;
}
.language-switcher__select:focus-visible{
  outline:2px solid rgba(47,128,237,.45);
  outline-offset:3px;
  border-radius:3px;
}
.language-switcher__chevron{
  position:absolute;
  right:1px;
  top:50%;
  width:8px;
  height:8px;
  border-right:1.5px solid currentColor;
  border-bottom:1.5px solid currentColor;
  transform:translateY(-68%) rotate(45deg);
  pointer-events:none;
}
.language-switcher.is-translating{opacity:.62}
.language-switcher.is-translating .language-switcher__select{cursor:progress}
.goog-te-banner-frame.skiptranslate,
.goog-te-gadget,
#google_translate_element,
body > .skiptranslate{display:none!important}
html body{top:0!important}

@media(max-width:850px){
  .language-switcher{
    width:100%;
    min-width:0;
    padding:11px 16px;
    color:#465a6f;
  }
  .language-switcher__select{
    width:100%;
    padding-top:5px;
    padding-bottom:5px;
    font-size:15px;
  }
  .language-switcher__chevron{right:18px}
}

html[lang="de"] .ad-placement:before{content:'Werbung wird erst nach Ihrer Einwilligung geladen'}

/* Fast custom language menu */
.language-switcher{
  position:relative;
  display:inline-flex;
  align-items:center;
  min-width:0;
  color:#465a6f;
  white-space:nowrap;
  z-index:70;
}
.language-switcher__button{
  min-height:40px;
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:8px 11px;
  border:1px solid #d7e1eb;
  border-radius:9px;
  background:#fff;
  color:#40546a;
  font:inherit;
  font-size:14px;
  font-weight:650;
  line-height:1;
  cursor:pointer;
  box-shadow:0 1px 2px rgba(18,52,91,.04);
  transition:border-color .18s ease,box-shadow .18s ease,background-color .18s ease,color .18s ease;
}
.language-switcher__button:hover,
.language-switcher.is-open .language-switcher__button{
  border-color:#a9c7e9;
  background:#f8fbff;
  color:var(--blue-deep);
  box-shadow:0 4px 14px rgba(35,91,151,.09);
}
.language-switcher__button:focus-visible{
  outline:3px solid rgba(47,128,237,.18);
  outline-offset:2px;
  border-color:var(--blue);
}
.language-switcher__globe{
  width:17px;
  height:17px;
  flex:0 0 auto;
  color:var(--blue-deep);
  pointer-events:none;
}
.language-switcher__current{min-width:52px;text-align:left}
.language-switcher__chevron{
  position:static;
  width:7px;
  height:7px;
  margin:-3px 1px 0 3px;
  border-right:1.5px solid currentColor;
  border-bottom:1.5px solid currentColor;
  transform:rotate(45deg);
  pointer-events:none;
  transition:transform .18s ease,margin .18s ease;
}
.language-switcher.is-open .language-switcher__chevron{
  margin:3px 1px 0 3px;
  transform:rotate(225deg);
}
.language-switcher__menu{
  position:absolute;
  top:calc(100% + 9px);
  right:0;
  width:190px;
  padding:7px;
  border:1px solid #dbe5ef;
  border-radius:11px;
  background:#fff;
  box-shadow:0 18px 42px rgba(18,52,91,.17);
  transform-origin:top right;
  animation:languageMenuIn .16s ease both;
}
.language-switcher__menu[hidden]{display:none!important}
.language-switcher__option{
  width:100%;
  display:grid;
  grid-template-columns:34px 1fr 20px;
  align-items:center;
  gap:9px;
  min-height:44px;
  padding:7px 9px;
  border:0;
  border-radius:8px;
  background:transparent;
  color:#40546a;
  text-align:left;
  font:inherit;
  font-size:14px;
  font-weight:600;
  cursor:pointer;
  transition:background-color .15s ease,color .15s ease;
}
.language-switcher__option:hover,
.language-switcher__option:focus-visible{
  outline:0;
  background:#f1f7fe;
  color:var(--blue-deep);
}
.language-switcher__option.is-selected{background:#eaf4ff;color:var(--blue-deep)}
.language-switcher__code{
  display:grid;
  place-items:center;
  width:31px;
  height:25px;
  border:1px solid #d3e1ef;
  border-radius:6px;
  background:#fff;
  color:#6c7f93;
  font-size:10px;
  font-weight:800;
  letter-spacing:.06em;
}
.language-switcher__option.is-selected .language-switcher__code{border-color:#b9d6f5;color:var(--blue-deep)}
.language-switcher__check{opacity:0;color:var(--blue);font-size:15px;text-align:center}
.language-switcher__option.is-selected .language-switcher__check{opacity:1}
.language-switcher.is-translating .language-switcher__globe{animation:languageSpin .9s linear infinite}
@keyframes languageMenuIn{from{opacity:0;transform:translateY(-5px) scale(.98)}to{opacity:1;transform:none}}
@keyframes languageSpin{to{transform:rotate(360deg)}}

@media(max-width:850px){
  .language-switcher{
    width:100%;
    padding:7px 8px 9px;
    flex-direction:column;
    align-items:stretch;
  }
  .language-switcher__button{
    width:100%;
    min-height:48px;
    justify-content:flex-start;
    padding:10px 12px;
    border-color:#e0e8f0;
    background:#f8fafc;
    font-size:15px;
  }
  .language-switcher__current{flex:1;min-width:0}
  .language-switcher__menu{
    position:static;
    width:100%;
    margin-top:7px;
    padding:6px;
    border-radius:9px;
    box-shadow:none;
    animation:languageMenuMobileIn .16s ease both;
  }
  .language-switcher__option{min-height:46px}
  @keyframes languageMenuMobileIn{from{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:none}}
}

@media(prefers-reduced-motion:reduce){
  .language-switcher__menu,
  .language-switcher__chevron,
  .language-switcher.is-translating .language-switcher__globe{animation:none!important;transition:none!important}
}

/* Mobile language control outside the hamburger menu */
.navlinks{margin-left:auto}
.nav-actions{
  display:flex;
  align-items:center;
  gap:8px;
  margin-left:24px;
  position:relative;
  z-index:72;
}

/* Borderless language trigger */
.language-switcher__button,
.language-switcher__button:hover,
.language-switcher.is-open .language-switcher__button{
  border:0;
  box-shadow:none;
}
.language-switcher__button{background:transparent}
.language-switcher__button:hover,
.language-switcher.is-open .language-switcher__button{background:#f3f7fb}

@media(max-width:850px){
  .nav{justify-content:flex-start}
  .brand{margin-right:auto}
  .nav-actions{
    margin-left:auto;
    gap:2px;
  }
  .language-switcher{
    width:auto;
    min-width:0;
    padding:0;
    flex-direction:row;
    align-items:center;
  }
  .language-switcher__button{
    width:auto;
    min-height:42px;
    justify-content:center;
    padding:8px 9px;
    border:0;
    background:transparent;
    box-shadow:none;
    font-size:14px;
  }
  .language-switcher__current{
    flex:0 1 auto;
    min-width:0;
  }
  .language-switcher__menu{
    position:absolute;
    top:calc(100% + 8px);
    right:0;
    width:190px;
    margin-top:0;
    padding:7px;
    border-radius:11px;
    box-shadow:0 18px 42px rgba(18,52,91,.17);
    transform-origin:top right;
    animation:languageMenuIn .16s ease both;
  }
  .menu{flex:0 0 44px}
}

@media(max-width:380px){
  .language-switcher__current{display:none}
  .language-switcher__button{padding-left:8px;padding-right:8px}
  .language-switcher__chevron{margin-left:1px}
}


/* Installable offline app */
.install-app-button{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  min-height:40px;
  padding:8px 12px;
  border:1px solid rgba(255,255,255,.22);
  border-radius:9px;
  background:rgba(255,255,255,.08);
  color:inherit;
  font:inherit;
  font-size:13px;
  font-weight:700;
  cursor:pointer;
  transition:background-color .18s ease,border-color .18s ease,transform .18s ease;
}
.install-app-button:hover{background:rgba(255,255,255,.15);border-color:rgba(255,255,255,.35);transform:translateY(-1px)}
.install-app-button:focus-visible{outline:3px solid rgba(120,184,255,.35);outline-offset:2px}
.install-app-button:disabled{cursor:default;opacity:.65;transform:none}
.install-app-button__icon{font-size:17px;line-height:1}
.install-app-dialog[hidden]{display:none!important}
.install-app-dialog{position:fixed;inset:0;z-index:1000;display:grid;place-items:center;padding:20px}
.install-app-dialog__backdrop{position:absolute;inset:0;background:rgba(8,20,36,.55);backdrop-filter:blur(4px)}
.install-app-dialog__card{
  position:relative;
  z-index:1;
  width:min(420px,100%);
  padding:30px;
  border:1px solid #dce6ef;
  border-radius:18px;
  background:#fff;
  color:#203247;
  box-shadow:0 28px 80px rgba(8,31,58,.28);
  text-align:center;
}
.install-app-dialog__card img{display:block;margin:0 auto 16px;border-radius:15px}
.install-app-dialog__card h2{margin:0 0 10px;font-size:25px;line-height:1.2}
.install-app-dialog__card p{margin:0;color:#60748a;line-height:1.65}
.install-app-dialog__x{position:absolute;top:12px;right:12px;width:38px;height:38px;border:0;border-radius:50%;background:#f2f6fa;color:#53677c;font-size:24px;cursor:pointer}
.install-app-dialog__actions{display:flex;justify-content:center;gap:10px;margin-top:24px}
.install-dialog-open{overflow:hidden}
.pwa-connection-notice{
  position:fixed;
  left:50%;
  bottom:18px;
  z-index:1100;
  max-width:min(520px,calc(100% - 32px));
  padding:11px 16px;
  border-radius:10px;
  background:#17324f;
  color:#fff;
  box-shadow:0 12px 35px rgba(5,25,48,.25);
  font-size:14px;
  font-weight:650;
  opacity:0;
  pointer-events:none;
  transform:translate(-50%,14px);
  transition:opacity .2s ease,transform .2s ease;
}
.pwa-connection-notice.is-visible{opacity:1;transform:translate(-50%,0)}
@media(max-width:700px){
  .install-app-button{width:100%}
  .install-app-dialog{padding:14px}
  .install-app-dialog__card{padding:28px 20px 22px}
  .install-app-dialog__actions{flex-direction:column-reverse}
  .install-app-dialog__actions .btn{width:100%}
}
@media(prefers-reduced-motion:reduce){
  .install-app-button,.pwa-connection-notice{transition:none!important}
}


/* Homepage offline app download section */
.offline-download-section{
  position:relative;
  overflow:hidden;
}
.offline-download-panel{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  align-items:center;
  gap:36px;
  padding:42px 46px;
  border:1px solid #dce7f0;
  border-radius:22px;
  background:linear-gradient(135deg,#f7fbff 0%,#ffffff 68%);
  box-shadow:0 18px 50px rgba(26,73,119,.08);
}
.offline-download-copy{max-width:720px}
.offline-download-copy h2{margin:7px 0 12px}
.offline-download-copy p{margin:0;color:#5f7286;line-height:1.75}
.offline-download-actions{display:flex;flex-direction:column;align-items:stretch;gap:10px;min-width:220px}
.download-app-button{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  min-height:50px;
  padding:12px 20px;
  border:0;
  border-radius:11px;
  background:#2f80ed;
  color:#fff;
  font:inherit;
  font-weight:800;
  cursor:pointer;
  box-shadow:0 10px 24px rgba(47,128,237,.24);
  transition:transform .18s ease,box-shadow .18s ease,background-color .18s ease;
}
.download-app-button:hover{background:#256fd1;transform:translateY(-2px);box-shadow:0 14px 28px rgba(47,128,237,.28)}
.download-app-button:focus-visible{outline:3px solid rgba(47,128,237,.3);outline-offset:3px}
.download-app-button:disabled{cursor:default;opacity:.68;transform:none;box-shadow:none}
.download-app-button__icon{width:19px;height:19px;flex:0 0 19px}
.offline-download-note{margin:0!important;text-align:center!important;font-size:12px!important;color:#718398!important;line-height:1.45!important}
@media(max-width:800px){
  .offline-download-panel{grid-template-columns:1fr;padding:32px 26px;gap:24px}
  .offline-download-actions{min-width:0;width:100%}
  .download-app-button{width:100%}
}
@media(max-width:520px){
  .offline-download-panel{padding:28px 20px;border-radius:17px}
}
@media(prefers-reduced-motion:reduce){
  .download-app-button{transition:none!important}
}

/* Mobile privacy page, privacy consent, and install dialog responsiveness */
html.install-dialog-open,
html.install-dialog-open body{
  overflow:hidden;
  overscroll-behavior:none;
}

/* Keep long install instructions inside the visible viewport on every device. */
.install-app-dialog{
  overflow:hidden;
}
.install-app-dialog__card{
  max-height:calc(100vh - 40px);
  max-height:calc(100dvh - 40px);
  overflow-y:auto;
  overscroll-behavior:contain;
  -webkit-overflow-scrolling:touch;
  scrollbar-gutter:stable;
}
.install-app-dialog__card,
.install-app-dialog__card *{
  min-width:0;
  overflow-wrap:anywhere;
}

/* The cookie/privacy panel must never extend below a short mobile screen. */
.consent-panel{
  max-height:calc(100vh - 28px);
  max-height:calc(100dvh - 28px);
  overflow-y:auto;
  overscroll-behavior:contain;
  -webkit-overflow-scrolling:touch;
}
.consent-copy,
.consent-main-actions,
.consent-manage{
  min-width:0;
}
.consent-copy p,
.consent-copy a,
.consent-main-actions button,
.consent-manage button{
  overflow-wrap:anywhere;
}

/* Privacy policy: comfortable reading and no horizontal overflow on phones. */
body.privacy-page main{
  min-width:0;
  overflow-x:hidden;
  overflow-x:clip;
}
body.privacy-page .article,
body.privacy-page .article *{
  min-width:0;
  max-width:100%;
}
body.privacy-page .article p,
body.privacy-page .article li,
body.privacy-page .article a,
body.privacy-page .article h2,
body.privacy-page .article h3{
  overflow-wrap:anywhere;
  word-break:normal;
}

@media(max-width:700px){
  /* Install instructions become a scroll-safe bottom sheet on mobile. */
  .install-app-dialog{
    place-items:end center;
    padding:0;
  }
  .install-app-dialog__card{
    width:100%;
    max-width:none;
    max-height:calc(100vh - 10px);
    max-height:calc(100dvh - 10px);
    padding:24px max(18px,env(safe-area-inset-right)) max(20px,calc(16px + env(safe-area-inset-bottom))) max(18px,env(safe-area-inset-left));
    border-right:0;
    border-bottom:0;
    border-left:0;
    border-radius:22px 22px 0 0;
    text-align:center;
  }
  .install-app-dialog__card img{
    width:54px;
    height:54px;
    margin-bottom:13px;
    border-radius:13px;
  }
  .install-app-dialog__card h2{
    padding:0 38px;
    margin-bottom:9px;
    font-size:22px;
    line-height:1.22;
  }
  .install-app-dialog__card p{
    font-size:14.5px;
    line-height:1.55;
  }
  .install-app-dialog__x{
    top:10px;
    right:max(10px,env(safe-area-inset-right));
    width:40px;
    height:40px;
  }
  .install-app-dialog__actions{
    width:100%;
    margin-top:18px;
    gap:9px;
  }
  .install-app-dialog__actions .btn{
    min-height:47px;
    white-space:normal;
  }

  /* Privacy/cookie consent becomes a touch-friendly bottom sheet. */
  .consent-backdrop{
    inset:0;
    align-items:flex-end;
    padding:0;
    background:rgba(8,20,36,.42);
    pointer-events:auto;
  }
  .consent-panel{
    width:100%;
    max-height:calc(100vh - 10px);
    max-height:calc(100dvh - 10px);
    grid-template-columns:1fr;
    gap:15px;
    padding:21px max(16px,env(safe-area-inset-right)) max(18px,calc(14px + env(safe-area-inset-bottom))) max(16px,env(safe-area-inset-left));
    border-right:0;
    border-bottom:0;
    border-left:0;
    border-radius:20px 20px 0 0;
    box-shadow:0 -16px 48px rgba(8,31,58,.24);
  }
  .consent-copy h2{
    margin-bottom:5px;
    font-size:20px;
    line-height:1.25;
  }
  .consent-copy p{
    font-size:14px;
    line-height:1.55;
  }
  .consent-main-actions{
    width:100%;
    flex-direction:column;
    align-items:stretch;
    gap:9px;
    white-space:normal;
  }
  .consent-main-actions button,
  .consent-manage button{
    width:100%;
    min-height:47px;
    padding:11px 14px;
    font-size:14px;
    white-space:normal;
  }
  .consent-manage{
    width:100%;
    flex-direction:column;
    align-items:stretch;
    gap:9px;
    padding-top:13px;
  }

  body.privacy-page .page-hero{
    width:100%;
    padding:48px 18px 54px;
  }
  body.privacy-page .page-hero h1{
    font-size:clamp(36px,11vw,44px);
    margin-bottom:13px;
  }
  body.privacy-page .page-hero p{
    font-size:16px;
    line-height:1.6;
  }
  body.privacy-page .article{
    width:100%;
    padding:34px 18px 68px;
  }
  body.privacy-page .article .last-updated{
    margin:0 0 24px;
    padding:11px 13px;
    border-radius:8px;
    background:#f5f8fb;
    font-size:12.5px;
    line-height:1.5;
  }
  body.privacy-page .article h2{
    margin:34px 0 10px;
    font-size:24px;
    line-height:1.28;
  }
  body.privacy-page .article h3{
    font-size:19px;
    line-height:1.35;
  }
  body.privacy-page .article p,
  body.privacy-page .article li{
    font-size:16px;
    line-height:1.72;
  }
  body.privacy-page .article ul,
  body.privacy-page .article ol{
    margin:14px 0 24px;
    padding-left:21px;
  }
  body.privacy-page .legal-list li{
    margin-bottom:12px;
  }
  body.privacy-page .policy-actions{
    display:grid;
    grid-template-columns:1fr;
    gap:10px;
    margin:20px 0 26px;
  }
  body.privacy-page .policy-actions .btn{
    width:100%;
    min-height:48px;
    display:flex;
    align-items:center;
    justify-content:center;
    padding:12px 14px;
    text-align:center;
    white-space:normal;
  }
}

@media(max-width:380px){
  body.privacy-page .article{
    padding-right:15px;
    padding-left:15px;
  }
  body.privacy-page .article p,
  body.privacy-page .article li{
    font-size:15.5px;
  }
}

@media(max-width:700px) and (max-height:620px){
  .install-app-dialog__card{
    padding-top:18px;
  }
  .install-app-dialog__card img{
    width:44px;
    height:44px;
    margin-bottom:8px;
  }
  .install-app-dialog__card h2{
    margin-bottom:7px;
    font-size:20px;
  }
  .install-app-dialog__card p{
    font-size:13.5px;
    line-height:1.45;
  }
  .install-app-dialog__actions{
    margin-top:13px;
  }
}


/* Keep the full-width mobile navigation centered on the viewport. */
@media(max-width:850px){
  .navlinks{
    left:50%;
    right:auto;
    width:100vw;
    max-width:none;
    margin-left:-50vw;
  }
}

/* Compact, centered homepage generator on tablets and phones. */
@media(max-width:850px){
  .home .lesspass-hero{
    min-height:calc(100svh - 68px);
    padding:24px 0 42px;
    align-items:center;
  }
  .home .lesspass-hero .hero-layout{
    width:min(100% - 24px,1120px);
    align-content:center;
    justify-items:center;
    gap:44px;
  }
  .home .generator-shell{
    width:min(440px,100%);
    min-height:0;
    height:auto;
    margin-inline:auto;
    display:block;
  }
  .home .step.active{
    display:block;
  }
}

@media(max-width:520px){
  .home .lesspass-hero{
    min-height:calc(100svh - 68px);
    padding:18px 0 34px;
  }
  .home .lesspass-hero .hero-layout{
    width:100%;
    padding-inline:14px;
    gap:36px;
  }
  .home .generator-shell{
    width:min(420px,100%);
    min-height:0;
    border-radius:8px;
  }
  .home .generator-bar{
    height:48px;
    padding-inline:16px;
  }
  .home .step{
    padding:20px 18px 17px;
  }
  .home .field-icon{
    width:34px;
    height:34px;
    margin-bottom:10px;
  }
  .home .step h2{
    font-size:21px;
  }
  .home .step>p{
    margin-bottom:13px;
    line-height:1.5;
  }
  .home .field{
    margin:10px 0;
  }
  .home .input-with-icon{
    height:46px;
  }
  .home .full{
    margin-top:10px;
  }
  .home .card-note{
    padding:9px 14px;
    line-height:1.4;
  }
}


/* Result actions: icon-only controls and a centered transparent static QR view. */
#step3 .step3-stage{
  display:grid;
  align-items:start;
  overflow:hidden;
}
#step3 .results-view,
#step3 .inline-qr-panel{
  grid-area:1/1;
  min-width:0;
}
#step3 .results-view{
  opacity:1;
  transform:translateX(0) scale(1);
  filter:blur(0);
  pointer-events:auto;
  transition:opacity .28s cubic-bezier(.2,.75,.25,1),transform .28s cubic-bezier(.2,.75,.25,1),filter .28s ease;
}
#step3.is-showing-inline-qr .results-view{
  opacity:0;
  transform:translateX(-18px) scale(.985);
  filter:blur(2px);
  pointer-events:none;
}
#step3 .result{
  display:grid;
  grid-template-columns:34px minmax(0,1fr) 34px;
  align-items:center;
  gap:8px;
  padding:9px 8px;
}
#step3 .result-main{min-width:0}
#step3 .value{max-width:none;min-width:0}
.result-action{
  width:34px;height:34px;display:grid;place-items:center;flex:0 0 34px;padding:0;
  border:0!important;outline:0;border-radius:50%;background:transparent;color:#718397;
  cursor:pointer;transition:background .16s ease,color .16s ease,transform .16s ease;
}
.result-action svg{width:18px;height:18px;display:block;pointer-events:none}
.result-action:hover{background:#edf5fe;color:var(--blue-deep)}
.result-action:active{transform:scale(.92)}
.result-action:focus-visible{box-shadow:0 0 0 3px rgba(47,128,237,.2);color:var(--blue-deep)}
.result-action.is-copied{color:var(--green);background:#e9f8f1}
.result-action.has-error{color:#c34f4f;background:#fff0f0}
.qr-action{justify-self:start}
.copy{justify-self:end;font-size:inherit;font-weight:inherit}
.generator-shell.qr-mode .card-note{opacity:0;visibility:hidden;transition:opacity .18s ease,visibility .18s ease}

.inline-qr-panel[hidden]{display:none!important}
.inline-qr-panel{
  display:grid;
  place-items:center;
  width:100%;
  min-height:410px;
  padding:14px 0 8px;
  border-radius:18px;
  background:transparent;
  box-shadow:none;
  opacity:0;
  transform:translateX(18px) scale(.985);
  filter:blur(2px);
  pointer-events:none;
  transition:opacity .28s cubic-bezier(.2,.75,.25,1),transform .28s cubic-bezier(.2,.75,.25,1),filter .28s ease;
}

.inline-qr-panel.is-visible{
  opacity:1;
  transform:translateX(0) scale(1);
  filter:blur(0);
  pointer-events:auto;
}
.inline-qr-frame{
  width:100%;
  min-height:100%;
  display:grid;
  place-items:center;
  align-content:center;
  gap:24px;
  padding:8px 18px 4px;
  background:transparent;
  border:0;
  box-shadow:none;
  text-align:center;
}

.inline-qr-canvas{
  display:grid;
  place-items:center;
  justify-content:center;
  width:100%;
  min-height:330px;
  margin:0 auto;
  padding:0;
  background:transparent;
  border:0;
  box-shadow:none;
}

.inline-qr-canvas canvas{
  display:block;
  width:min(100%,340px)!important;
  max-width:340px;
  height:auto!important;
  image-rendering:pixelated;
  border-radius:0;
  filter:drop-shadow(0 10px 18px rgba(18,52,91,.22));
  animation:qrArrive .34s cubic-bezier(.2,.75,.25,1) both;
}

.inline-qr-actions{display:flex;justify-content:center;width:100%;margin:0}
.inline-qr-actions .btn{width:min(240px,100%);margin:0;background:var(--blue);color:#fff}
.inline-qr-actions .btn:hover{background:var(--blue-deep)}

.inline-qr-error{color:#b44747;font-size:14px;line-height:1.5}
@keyframes qrArrive{from{opacity:0;transform:scale(.94)}to{opacity:1;transform:none}}

@media(max-width:520px){
  #step3 .result{grid-template-columns:32px minmax(0,1fr) 32px;gap:6px;padding:8px 6px}
  .result-action{width:32px;height:32px;flex-basis:32px}
  .result-action svg{width:17px;height:17px}
  .inline-qr-panel{min-height:360px;padding:10px 10px 8px;border-radius:16px}
  .inline-qr-frame{gap:16px;padding:0 6px}
  .inline-qr-canvas{min-height:280px}
  .inline-qr-canvas canvas{width:min(100%,300px)!important;max-width:300px}
  .inline-qr-actions .btn{width:100%}
}


@media(prefers-reduced-motion:reduce){
  #step3 .results-view,.inline-qr-panel,.inline-qr-canvas canvas{transition:none!important;animation:none!important}
}


/* Keep the QR view centered within the compact mobile generator card. */
@media(max-width:520px){
  .generator-shell.qr-mode #step3.active{
    display:grid;
    place-items:center;
    width:100%;
    min-height:410px;
    padding:12px 16px 14px;
  }
  .generator-shell.qr-mode #step3 .step3-stage{
    width:100%;
    min-height:386px;
    display:grid;
    place-items:center;
  }
  .generator-shell.qr-mode .inline-qr-panel{
    width:100%;
    min-height:386px;
    margin:0;
    padding:0;
    place-self:center;
  }
  .generator-shell.qr-mode .inline-qr-frame{
    width:100%;
    min-height:386px;
    align-content:center;
    justify-items:center;
    padding:8px 0;
  }
  .generator-shell.qr-mode .inline-qr-canvas{
    width:100%;
    min-height:284px;
    margin:0 auto;
    place-items:center;
  }
  .generator-shell.qr-mode .inline-qr-canvas canvas{margin-inline:auto}
}


/* Performance: postpone rendering below-the-fold sections until they approach the viewport. */
@supports (content-visibility:auto){
  .home main>.section,
  .home main>.faq-section,
  body:not(.home) main>.section,
  body:not(.home) main>.article{
    content-visibility:auto;
    contain-intrinsic-size:auto 760px;
  }
}


/* Readable, wider homepage hero. */
.home .lesspass-hero .hero-layout{
  width:min(1240px,calc(100% - 48px));
  grid-template-columns:minmax(430px,490px) minmax(500px,1fr);
  gap:clamp(64px,7vw,108px);
}
.home .hero-copy{
  width:100%;
  max-width:620px;
  padding:6px 0 20px;
  color:var(--ink);
}
.home .hero-kicker{
  display:inline-flex;
  align-items:center;
  gap:8px;
  color:var(--blue-deep);
  opacity:1;
  font-size:12px;
  font-weight:750;
  letter-spacing:.14em;
}
.home .hero-kicker::before{
  content:"";
  width:28px;
  height:2px;
  border-radius:99px;
  background:var(--blue);
}
.home .hero-copy h1{
  max-width:620px;
  margin:15px 0 18px;
  color:var(--navy);
  font-size:clamp(50px,5.2vw,70px);
  line-height:1;
  letter-spacing:-.055em;
  font-weight:350;
}
.home .hero-copy>p{
  max-width:590px;
  margin:0;
  color:#53687d;
  font-size:17px;
  line-height:1.62;
}
.home .hero-points{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:10px;
  width:100%;
  max-width:610px;
  margin:24px 0;
}
.home .hero-points>span{
  display:flex;
  align-items:center;
  gap:10px;
  min-width:0;
  min-height:74px;
  padding:12px;
  border-radius:12px;
  color:#334b63;
}
.home .hero-points>span b{
  display:block;
  color:#334b63;
  font-size:13px;
  font-weight:700;
  line-height:1.3;
  letter-spacing:0;
  opacity:1;
}
.home .hero-point-icon{
  width:34px;
  height:34px;
  display:grid;
  place-items:center;
  flex:0 0 34px;
  border-radius:0;
  background:transparent;
  color:var(--blue-deep);
}
.home .hero-point-icon svg{
  width:18px;
  height:18px;
  display:block;
}
.home .outline-cta{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:14px;
  padding:12px 18px;
  border:1px solid #b9d3f1;
  border-radius:8px;
  background:#fff;
  color:var(--blue-deep);
  font-size:14px;
  font-weight:700;
  box-shadow:0 8px 20px rgba(37,83,132,.05);
}
.home .outline-cta:hover{
  background:#eff6ff;
  border-color:var(--blue);
}
@media(max-width:1040px){
  .home .lesspass-hero .hero-layout{
    grid-template-columns:minmax(400px,470px) minmax(0,1fr);
    gap:48px;
  }
  .home .hero-points{grid-template-columns:1fr}
  .home .hero-points>span{min-height:54px}
}
@media(max-width:850px){
  .home .lesspass-hero .hero-layout{
    width:min(100% - 24px,620px);
    grid-template-columns:1fr;
    gap:42px;
  }
  .home .hero-copy{
    grid-row:2;
    max-width:620px;
    margin:0 auto;
    padding:0 4px 4px;
    text-align:left;
  }
  .home .hero-copy h1,
  .home .hero-copy>p{max-width:none}
  .home .hero-copy>p{margin:0}
  .home .hero-points{
    grid-template-columns:1fr;
    width:100%;
    max-width:none;
    margin:20px 0;
  }
  .home .hero-points>span{text-align:left}
}
@media(max-width:520px){
  .home .hero-copy h1{
    margin-bottom:15px;
    font-size:42px;
    line-height:1.02;
  }
  .home .hero-copy>p{
    font-size:16px;
    line-height:1.55;
  }
  .home .hero-points{
    gap:8px;
    margin:18px 0 20px;
  }
  .home .hero-points>span{
    min-height:52px;
    padding:9px 10px;
  }
}


/* Results heading: success icon aligned to the right of the title. */
#step3 .result-heading{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
  margin:0 0 5px;
}
#step3 .result-heading h2{
  margin:0;
}
#step3 .result-heading .field-icon.success{
  flex:0 0 38px;
  margin:0;
}
@media(max-width:520px){
  #step3 .result-heading{gap:10px}
  #step3 .result-heading .field-icon.success{
    width:34px;
    height:34px;
    flex-basis:34px;
  }
}


/* Clear pricing and availability statement under the homepage CTA. */
.home .hero-product-status{
  display:flex;
  align-items:center;
  flex-wrap:wrap;
  gap:8px 14px;
  margin-top:14px;
  color:#5c7085;
  font-size:12px;
  font-weight:650;
}
.home .hero-product-status span{
  display:inline-flex;
  align-items:center;
  gap:7px;
}
.home .hero-product-status span::before{
  content:"✓";
  color:var(--green);
  font-weight:800;
}
@media(max-width:520px){
  .home .hero-product-status{gap:7px 12px;margin-top:12px}
}


/* Support Kardix page */
.support-page .page-hero{padding-bottom:72px}
.support-page .page-hero p{max-width:680px}
.support-section{padding:72px 0}
.support-layout{display:grid;grid-template-columns:minmax(0,1.08fr) minmax(300px,.92fr);gap:28px;align-items:stretch}
.support-card{border:1px solid var(--line);background:#fff;border-radius:18px;padding:32px;box-shadow:0 18px 50px rgba(18,52,91,.08)}
.support-card--primary{position:relative;overflow:hidden}
.support-card--primary::after{content:"";position:absolute;width:220px;height:220px;right:-90px;top:-100px;border-radius:50%;background:radial-gradient(circle,rgba(47,128,237,.13),rgba(47,128,237,0) 70%);pointer-events:none}
.support-icon{width:52px;height:52px;display:grid;place-items:center;border-radius:16px;background:#eef6ff;color:var(--blue);margin-bottom:20px}
.support-icon svg{width:28px;height:28px}
.support-card h2{font-size:30px;line-height:1.15;letter-spacing:-.03em;margin:0 0 12px;color:var(--navy);font-weight:550}
.support-card>p{margin:0 0 22px;color:#607286;font-size:16px}
.support-list{list-style:none;padding:0;margin:0;display:grid;gap:14px}
.support-list li{display:grid;grid-template-columns:24px minmax(0,1fr);gap:10px;align-items:start;color:#45596d}
.support-list svg{width:20px;height:20px;color:var(--blue);margin-top:2px}
.paypal-support-box{margin-top:26px;padding:20px;border-radius:14px;background:#f6f9fd;border:1px solid #e1eaf4;text-align:center}
.paypal-support-box strong{display:block;color:var(--navy);font-size:16px;margin-bottom:5px}
.paypal-support-box p{margin:0 0 15px;color:#6b7d90;font-size:13px;line-height:1.55}
.support-smallprint{margin:15px 0 0!important;font-size:12px!important;color:#7b8999!important}
.support-alternatives{padding:72px 0;background:#f6f8fb;border-top:1px solid #edf1f5}
.support-options{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:30px}
.support-option{padding:24px;border:1px solid #dfe7f0;background:#fff;border-radius:14px}
.support-option svg{width:25px;height:25px;color:var(--blue);margin-bottom:13px}
.support-option h3{margin:0 0 8px;font-size:18px;color:var(--navy)}
.support-option p{margin:0;color:#68798b;font-size:14px}
.support-note{margin-top:28px;padding:18px 20px;border-left:4px solid var(--blue);background:#eef6ff;color:#53677b;font-size:14px}
@media(max-width:800px){.support-layout{grid-template-columns:1fr}.support-options{grid-template-columns:1fr}.support-section,.support-alternatives{padding:56px 0}}
@media(max-width:520px){.support-card{padding:24px 20px;border-radius:14px}.support-card h2{font-size:25px}.paypal-support-box{padding:18px 12px}.support-page .page-hero{padding:54px 0 62px}}

/* Homepage support CTA */
.home-support-section{
  padding-top:0;
}
.home-support-panel{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  align-items:center;
  gap:26px;
  padding:30px 34px;
  border:1px solid #dce7f0;
  border-radius:20px;
  background:#fff;
  box-shadow:0 16px 44px rgba(18,52,91,.07);
}
.home-support-panel h2{
  margin:7px 0 8px;
  font-size:clamp(26px,3vw,34px);
  line-height:1.15;
  letter-spacing:-.03em;
}
.home-support-panel p{
  margin:0;
  color:#5f7286;
  max-width:720px;
}
.home-support-button{
  white-space:nowrap;
  margin:0;
}
@media(max-width:720px){
  .home-support-panel{
    grid-template-columns:1fr;
    padding:26px 22px;
    text-align:left;
  }
  .home-support-button{
    width:100%;
    text-align:center;
  }
}


/* Personal PayPal support flow (no charity/donation SDK). */
.paypal-personal-actions{display:grid;gap:10px;margin-top:16px}
.paypal-personal-button,.paypal-copy-email{display:flex;align-items:center;justify-content:center;gap:10px;min-height:48px;padding:12px 18px;border:0;border-radius:9px;font-weight:750;cursor:pointer;text-align:center}
.paypal-personal-button{background:#0070ba;color:#fff;box-shadow:0 8px 20px rgba(0,112,186,.2)}
.paypal-personal-button:hover{background:#005ea6;color:#fff}
.paypal-personal-button svg{width:21px;height:21px;flex:0 0 21px}
.paypal-copy-email{background:#e8f1fa;color:#184b75}
.paypal-copy-email:hover{background:#dceaf7}
.paypal-recipient{display:grid;gap:2px;margin-top:14px;padding:11px 13px;border:1px solid #dce7f0;border-radius:9px;background:#fff;color:#35506b}
.paypal-recipient span{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.08em;color:#75879a}
.paypal-recipient strong{font-size:14px;word-break:break-all}
.paypal-copy-status{min-height:20px!important;margin:8px 0 0!important;color:#24724c!important;font-weight:650}
@media(max-width:520px){.paypal-personal-button,.paypal-copy-email{width:100%}.paypal-personal-button{padding-inline:12px}}


/* Product-first hero balance: generator is the primary visual focus. */
.home .lesspass-hero .hero-layout{
  width:min(1280px,calc(100% - 40px));
  grid-template-columns:minmax(520px,580px) minmax(460px,520px);
  justify-content:center;
  gap:clamp(40px,4vw,60px);
}
.home .generator-shell{
  width:100%;
  box-shadow:0 24px 60px rgba(32,72,116,.19);
}
.home .hero-copy{
  max-width:520px;
  padding:4px 0 14px;
}
.home .hero-kicker{
  font-size:10px;
  letter-spacing:.13em;
}
.home .hero-copy h1{
  max-width:520px;
  margin:12px 0 14px;
  font-size:clamp(38px,4vw,50px);
  line-height:1.04;
  letter-spacing:-.045em;
  font-weight:400;
}
.home .hero-copy>p{
  max-width:520px;
  font-size:15px;
  line-height:1.55;
}
.home .hero-points{
  grid-template-columns:1fr;
  max-width:500px;
  gap:2px;
  margin:16px 0 18px;
}
.home .hero-points>span{
  min-height:40px;
  padding:5px 0;
  border-radius:0;
}
.home .hero-points>span b{
  font-size:12.5px;
}
.home .hero-point-icon{
  width:28px;
  height:28px;
  flex-basis:28px;
}
.home .hero-point-icon svg{
  width:17px;
  height:17px;
}
.home .outline-cta{
  padding:10px 15px;
  font-size:13px;
}
@media(max-width:1040px){
  .home .lesspass-hero .hero-layout{
    grid-template-columns:minmax(470px,530px) minmax(390px,450px);
    gap:32px;
  }
}
@media(max-width:850px){
  .home .lesspass-hero .hero-layout{
    width:min(100% - 24px,620px);
    grid-template-columns:1fr;
    gap:32px;
  }
  .home .generator-shell{grid-row:1}
  .home .hero-copy{
    grid-row:2;
    max-width:540px;
    padding:0 6px 2px;
  }
  .home .hero-copy h1{
    max-width:500px;
    font-size:clamp(34px,8vw,44px);
  }
  .home .hero-copy>p{max-width:520px}
  .home .hero-points{max-width:440px}
}
@media(max-width:520px){
  .home .hero-copy h1{
    margin:10px 0 12px;
    font-size:34px;
  }
  .home .hero-copy>p{
    font-size:14px;
    line-height:1.5;
  }
  .home .hero-points{
    margin:13px 0 16px;
  }
}


/* Keep the three hero benefits on one horizontal line on desktop. */
.home .hero-points{
  display:flex;
  align-items:center;
  flex-wrap:nowrap;
  gap:18px;
  width:100%;
  max-width:520px;
  margin:16px 0 18px;
}
.home .hero-points>span{
  display:inline-flex;
  align-items:center;
  flex:0 0 auto;
  min-height:0;
  padding:4px 0;
  gap:7px;
  white-space:nowrap;
}
.home .hero-points>span b{
  font-size:12px;
  white-space:nowrap;
}
.home .hero-point-icon{
  width:24px;
  height:24px;
  flex:0 0 24px;
}
.home .hero-point-icon svg{width:15px;height:15px}
@media(max-width:1040px){
  .home .hero-points{gap:12px}
  .home .hero-points>span{gap:6px}
  .home .hero-points>span b{font-size:11.5px}
}
@media(max-width:850px){
  .home .hero-points{
    justify-content:center;
    flex-wrap:wrap;
    max-width:520px;
    gap:8px 16px;
  }
}
@media(max-width:520px){
  .home .hero-points{
    justify-content:flex-start;
    gap:7px 12px;
  }
  .home .hero-points>span b{font-size:11px}
  .home .hero-point-icon{width:22px;height:22px;flex-basis:22px}
}


/* 2026-06-19: mobile first-screen layout fix.
   On phones/tablets the generator card is centered in the first viewport,
   while the explanatory hero text starts below the fold. */
@media(max-width:850px){
  body.home .lesspass-hero{
    min-height:auto;
    padding:0 0 48px;
    align-items:stretch;
    overflow:visible;
  }

  body.home .lesspass-hero .hero-layout{
    width:min(100% - 24px,620px);
    min-height:calc(100svh - 68px);
    display:grid;
    grid-template-columns:1fr;
    grid-template-rows:minmax(calc(100svh - 68px),auto) auto;
    gap:34px;
    align-items:center;
    justify-items:center;
    margin-inline:auto;
  }

  body.home .generator-shell{
    grid-row:1;
    align-self:center;
    justify-self:center;
    width:min(440px,100%);
    margin:0 auto;
  }

  body.home .hero-copy{
    grid-row:2;
    width:100%;
    max-width:620px;
    margin:0 auto;
    padding:0 4px;
    text-align:left;
  }
}

@media(max-width:520px){
  body.home .lesspass-hero{
    padding:0 0 42px;
  }

  body.home .lesspass-hero .hero-layout{
    width:100%;
    min-height:calc(100svh - 68px);
    grid-template-rows:minmax(calc(100svh - 68px),auto) auto;
    padding-inline:14px;
    gap:30px;
  }

  body.home .generator-shell{
    width:min(420px,100%);
  }
}


/* 2026-06-19 Nexus-inspired editorial theme
   Source inspiration: warm paper background, Cormorant Garamond display type,
   DM Sans body text, DM Mono labels, thin editorial borders, quiet green accents.
   Keeps Kardix navbar/hero markup and generator behavior intact. */
:root{
  --blue:#2d4a3e;
  --blue-deep:#233c33;
  --navy:#0f0e0c;
  --paper:#f5f2ec;
  --ink:#0f0e0c;
  --muted:#6b6560;
  --line:rgba(15,14,12,.12);
  --soft:#eeeae2;
  --green:#4a7c6f;
  --warm:#c8b89a;
  --accent:#2d4a3e;
  --accent-light:#4a7c6f;
  font-family:'DM Sans',-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
}

html{background:var(--paper)}
body{
  background:var(--paper);
  color:var(--ink);
  font-family:'DM Sans',-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  font-weight:300;
  line-height:1.7;
  letter-spacing:0;
}
strong,b{font-weight:500;color:var(--ink)}
code,kbd,pre,.value{
  font-family:'DM Mono',ui-monospace,SFMono-Regular,Consolas,monospace;
}
pre{background:#eeeae2;border:1px solid var(--line);padding:18px;overflow:auto}

/* Keep the existing navbar structure, but give the text the uploaded page typography. */
.site-header{
  background:rgba(245,242,236,.94);
  color:var(--ink);
  border-bottom:1px solid var(--line);
  box-shadow:none;
  backdrop-filter:blur(12px);
}
.brand{color:var(--ink);font-weight:400;letter-spacing:.02em}
.brand span:not(.logo-mark){font-family:'Cormorant Garamond',serif;font-size:1.6rem;line-height:1}
.logo-mark,.mini-logo{background:var(--accent);color:var(--paper);border-radius:3px}
.navlinks a{
  font-family:'DM Mono',ui-monospace,monospace;
  font-size:.72rem;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:var(--muted);
  opacity:1;
}
.navlinks a:hover{color:var(--ink)}
.github-link{border-color:var(--line);color:var(--accent)!important;background:transparent}
.github-link:hover{border-color:var(--accent);background:var(--accent);color:#fff!important}
.menu span{background:var(--ink)}
.language-switcher__button{color:var(--accent);font-family:'DM Mono',ui-monospace,monospace;letter-spacing:.08em;text-transform:uppercase}
.language-switcher__menu{background:var(--paper);border-color:var(--line);box-shadow:0 18px 44px rgba(15,14,12,.12)}
.language-switcher__option{color:var(--ink)}
.language-switcher__option:hover,.language-switcher__option.is-selected{background:#eeeae2;color:var(--accent)}

/* Keep the homepage hero and generator layout, but harmonize the palette and type. */
.lesspass-hero{background:var(--paper);color:var(--ink);border-bottom:1px solid var(--line)}
.home .lesspass-hero{background:var(--paper)}
.hero-kicker,.eyebrow,.section-tag,.articlecard small,.blog-count,.last-updated{
  font-family:'DM Mono',ui-monospace,monospace;
  letter-spacing:.2em;
  text-transform:uppercase;
  color:var(--accent);
  font-weight:300;
}
.hero-copy h1,.page-hero h1,.sectionhead h2,.section-title,.article h1,.article h2,.article h3,.card h3,.articlecard h3,.about-summary h2,.contact-method h2,.faq-item summary,.step h2{
  font-family:'Cormorant Garamond',Georgia,serif;
  font-weight:300;
  letter-spacing:-.025em;
  color:var(--ink);
}
.hero-copy h1{color:var(--ink);line-height:1.02}
.hero-copy>p{color:var(--muted);font-size:1rem;line-height:1.9;max-width:42ch}
.hero-points span{color:var(--muted)}
.hero-points b{font-family:'DM Mono',ui-monospace,monospace;color:var(--accent);font-weight:300;letter-spacing:.12em;text-transform:uppercase}
.hero-point-icon{border-color:var(--line);background:#eeeae2;color:var(--accent)}
.outline-cta,.hero-cta{
  background:var(--accent);
  border:1px solid var(--accent);
  color:#fff;
  border-radius:0;
  font-family:'DM Mono',ui-monospace,monospace;
  font-weight:400;
  letter-spacing:.1em;
  text-transform:uppercase;
}
.outline-cta:hover,.hero-cta:hover{background:var(--accent-light);border-color:var(--accent-light);color:#fff;transform:translateX(4px)}

.generator-shell{background:#fffdf8;border:1px solid var(--line);border-radius:0;box-shadow:0 22px 50px rgba(15,14,12,.10)}
.generator-bar{background:var(--ink);color:var(--paper)}
.progress{background:#e7e1d6}.progress span.active{background:var(--accent-light)}
.field-icon{background:#eeeae2;color:var(--accent)}
.field-icon.success{background:#e7eee9;color:var(--accent-light)}
.step>p,.field>span,.card-note{color:var(--muted)}
.input-with-icon{border:1px solid var(--line);background:#fffdf8;height:50px}
.input-with-icon:focus-within{border-color:var(--accent);box-shadow:0 0 0 3px rgba(45,74,62,.12)}
.input-with-icon>span{border-right:1px solid var(--line);color:var(--muted)}
.btn{border-radius:0;font-family:'DM Mono',ui-monospace,monospace;letter-spacing:.06em;text-transform:uppercase;font-weight:400}
.primary{background:var(--accent);color:#fff}.primary:hover{background:var(--accent-light)}
.secondary{background:#eeeae2;color:var(--ink)}
.copy{background:#e7eee9;color:var(--accent);border-radius:0;font-family:'DM Mono',ui-monospace,monospace;font-weight:400}
.result{border-color:var(--line);background:#fffdf8}.result.featured{border-color:var(--accent-light);background:#f3f1ea}
.result label{font-family:'DM Mono',ui-monospace,monospace;color:var(--muted);font-weight:300}

/* Editorial page sections */
.section{padding:7rem 0;background:var(--paper)}
.section.alt{background:#eeeae2;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.sectionhead{max-width:780px;text-align:left;margin:0 0 3rem}
.sectionhead h2{font-size:clamp(2.2rem,4vw,3.6rem);line-height:1.08;margin:.65rem 0 1.1rem}
.sectionhead p{color:var(--muted);font-size:1rem;line-height:1.9;max-width:62ch}
.editorial-intro{max-width:820px;margin:0;text-align:left}
.editorial-intro p{color:var(--muted);font-size:1.02rem;line-height:1.95}

.page-hero{
  background:var(--ink);
  color:var(--paper);
  text-align:left;
  padding:clamp(5.5rem,9vw,8rem) 0 clamp(5rem,7vw,7rem);
  border-bottom:0;
}
.page-hero h1{color:var(--paper);font-size:clamp(3rem,6vw,5.2rem);line-height:1.03;max-width:900px;margin:0 0 1.35rem}
.page-hero p{color:rgba(245,242,236,.68);font-size:1rem;line-height:1.9;max-width:62ch;margin:0}
.page-hero .eyebrow{color:var(--warm)}

.cards,.articlegrid{display:grid;grid-template-columns:repeat(3,1fr);gap:0;border:1px solid var(--line);background:transparent}
.card,.articlecard{
  background:transparent;
  border:0;
  border-right:1px solid var(--line);
  border-bottom:1px solid var(--line);
  box-shadow:none;
  padding:2.4rem;
}
.card:nth-child(3n),.articlecard:nth-child(3n){border-right:0}
.card:nth-last-child(-n+3),.articlecard:nth-last-child(-n+3){border-bottom:0}
.card .num{font-family:'DM Mono',ui-monospace,monospace;color:var(--warm);font-size:.72rem;letter-spacing:.14em;text-transform:uppercase}
.card h3,.articlecard h3{font-size:1.55rem;line-height:1.18;margin:.85rem 0 .8rem;color:var(--ink)}
.card p,.articlecard p{color:var(--muted);font-size:.95rem;line-height:1.85;margin:0}
.articlecard small{display:block;margin-bottom:.95rem;font-size:.66rem}
.articlecard:hover{background:#eeeae2}
.filterbar{justify-content:flex-start;margin-bottom:2.5rem}
.filter-btn{border:1px solid var(--line);background:transparent;color:var(--muted);border-radius:0;font-family:'DM Mono',ui-monospace,monospace;font-size:.72rem;letter-spacing:.1em;text-transform:uppercase;font-weight:300}
.filter-btn.active,.filter-btn:hover{background:var(--accent);border-color:var(--accent);color:#fff}
.blog-count{text-align:left;margin:-1.4rem 0 2rem;color:var(--muted);font-size:.68rem}

.article{width:min(780px,calc(100% - 36px));padding:5.5rem 0 8rem}
.article .meta,.article-meta-box{font-family:'DM Mono',ui-monospace,monospace;color:var(--muted);font-size:.72rem;letter-spacing:.08em;text-transform:uppercase;text-align:left;justify-content:flex-start;margin-bottom:3.4rem}
.article h1{font-size:clamp(3rem,6vw,5rem);line-height:1.02;margin:0 0 1.2rem}
.article h2{font-size:clamp(2rem,3.4vw,2.8rem);line-height:1.12;margin:3.5rem 0 1rem;color:var(--ink)}
.article h3{font-size:1.65rem;line-height:1.2;margin:2.4rem 0 .8rem;color:var(--ink)}
.article p,.article li{color:#3f3b35;font-size:1.03rem;line-height:1.95}
.article p{margin:0 0 1.25rem}
.article ul,.article ol{padding-left:1.25rem;margin:1rem 0 1.5rem}
.article li{margin-bottom:.55rem}
.article a{color:var(--accent);text-decoration:underline;text-underline-offset:4px}
.article .lead,.article p.lead{font-family:'Cormorant Garamond',Georgia,serif;font-size:clamp(1.35rem,2.4vw,1.9rem);line-height:1.55;color:var(--ink)}
.article .note,blockquote,.article blockquote{
  border-left:2px solid var(--accent);
  background:#eeeae2;
  color:var(--ink);
  padding:1.4rem 1.6rem;
  margin:2.2rem 0;
}
.article .note p,.article blockquote p,blockquote p{margin:0;color:var(--ink)}

/* Legal/support/about/contact pages */
.about-summary,.operator-card,.contact-card,.contact-method,.pillar{
  background:#fffdf8;
  border:1px solid var(--line);
  box-shadow:none;
}
.about-summary,.operator-card{padding:2.3rem;align-items:center}
.about-summary h2,.contact-method h2{font-size:2rem;line-height:1.12}
.about-summary p,.operator-card p,.contact-card p,.contact-method p,.pillar p{color:var(--muted);line-height:1.85}
.about-summary .location,.contact-card a,.contact-method a,.address-highlight{color:var(--accent);font-weight:500}
.address-highlight{background:#eeeae2;border-color:var(--line)}
.contact-methods{gap:0;border:1px solid var(--line);background:transparent}
.contact-method{border:0;border-right:1px solid var(--line)}
.contact-method:nth-child(2n){border-right:0}
.policy-actions{gap:12px}
.legal-list li{color:#3f3b35;line-height:1.9}

/* FAQ and trust strips */
.faq-section{background:var(--paper);border-top:1px solid var(--line)}
.faq-list{border-top:1px solid var(--line)}
.faq-item{background:transparent;border-bottom:1px solid var(--line);margin:0}
.faq-item summary{border:0;color:var(--ink);font-size:1.35rem;font-weight:300;padding:1.35rem 0}
.faq-answer p{color:var(--muted);line-height:1.85;padding:0 48px 1.35rem 0}
.faq-item summary span{color:var(--accent)}
.trust-strip{background:#eeeae2;border-color:var(--line)}
.trust-strip p{color:var(--muted)}
.trust-strip strong{color:var(--ink)}

/* Ads and consent should visually fit but stay functional. */
.ad-placement{background:transparent;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.ad-label,.ad-placement:before{font-family:'DM Mono',ui-monospace,monospace;color:var(--muted);font-weight:300;letter-spacing:.14em;text-transform:uppercase}
.consent-panel{background:#fffdf8;border:1px solid var(--line);border-radius:0;box-shadow:0 14px 44px rgba(15,14,12,.14)}
.consent-copy h2{font-family:'Cormorant Garamond',Georgia,serif;font-weight:300;font-size:1.45rem;color:var(--ink)}
.consent-copy p{color:var(--muted)}
.consent-link-button{border-color:var(--line);background:transparent;color:var(--accent)}
.consent-accept{border-color:var(--accent);background:var(--accent);color:#fff}

/* Footer matches the dark right-side area of the uploaded page. */
.footer{background:var(--ink);color:rgba(245,242,236,.76);border-top:0}
.footer a{color:rgba(245,242,236,.88)}
.footer small{color:rgba(245,242,236,.48)}
.footer .brand span:not(.logo-mark){color:var(--paper)}
.footer .trust-strip{background:rgba(245,242,236,.035);border-bottom:1px solid rgba(245,242,236,.12)}
.footer .trust-strip p{color:rgba(245,242,236,.65)}
.footer .trust-strip strong{color:var(--paper)}
.footer .cookie-settings-link{border-color:rgba(245,242,236,.22);color:rgba(245,242,236,.76);border-radius:0;font-family:'DM Mono',ui-monospace,monospace}

@media(max-width:900px){
  .cards,.articlegrid{grid-template-columns:1fr 1fr}
  .card:nth-child(3n),.articlecard:nth-child(3n){border-right:1px solid var(--line)}
  .card:nth-child(2n),.articlecard:nth-child(2n){border-right:0}
  .card:nth-last-child(-n+3),.articlecard:nth-last-child(-n+3){border-bottom:1px solid var(--line)}
  .card:nth-last-child(-n+2),.articlecard:nth-last-child(-n+2){border-bottom:0}
}
@media(max-width:850px){
  .site-header{background:rgba(245,242,236,.97)}
  .navlinks{background:var(--paper);border-color:var(--line);box-shadow:0 18px 34px rgba(15,14,12,.12)}
  .navlinks a{font-size:.78rem;color:var(--ink)}
  .home .hero-copy{text-align:left}
  .section{padding:5rem 0}
  .page-hero{padding:4.8rem 0 4.4rem}
}
@media(max-width:650px){
  .sectionhead{margin-bottom:2.2rem}
  .cards,.articlegrid{grid-template-columns:1fr}
  .card,.articlecard,.card:nth-child(2n),.articlecard:nth-child(2n),.card:nth-child(3n),.articlecard:nth-child(3n){border-right:0;border-bottom:1px solid var(--line);padding:1.8rem}
  .card:last-child,.articlecard:last-child{border-bottom:0}
  .card:nth-last-child(-n+2),.articlecard:nth-last-child(-n+2){border-bottom:1px solid var(--line)}
  .card:last-child,.articlecard:last-child{border-bottom:0}
  .article{width:min(100% - 28px,780px);padding:4.2rem 0 6rem}
  .article p,.article li{font-size:1rem;line-height:1.85}
  .page-hero h1{font-size:clamp(2.6rem,13vw,4rem)}
  .contact-method{border-right:0;border-bottom:1px solid var(--line)}
  .contact-method:last-child{border-bottom:0}
  .faq-item summary{font-size:1.15rem}
  .faq-answer p{padding-right:0}
}


/* 2026-06-19: centering and card surface polish
   Keep the generator/nav structure, but make headings and page sections visually centered. */
:root{
  --card-surface:#fffaf1;
  --card-surface-strong:#fffdf8;
}

/* Center hero/page headings consistently across all non-generator pages. */
.page-hero,
.page-hero.wrap{
  text-align:center!important;
  margin-left:auto!important;
  margin-right:auto!important;
  border-radius:1px!important;
}
.page-hero h1,
.page-hero p,
.page-hero .eyebrow{
  margin-left:auto!important;
  margin-right:auto!important;
  text-align:center!important;
}
.page-hero h1{max-width:980px!important;}
.page-hero p{max-width:760px!important;}

/* Center section headings on the home page and content pages. */
.sectionhead,
.editorial-intro,
.article .sectionhead{
  text-align:center!important;
  margin-left:auto!important;
  margin-right:auto!important;
}
.sectionhead h1,
.sectionhead h2,
.sectionhead p,
.editorial-intro h1,
.editorial-intro h2,
.editorial-intro p,
.editorial-intro .eyebrow{
  text-align:center!important;
  margin-left:auto!important;
  margin-right:auto!important;
}
.editorial-intro{max-width:880px!important;}
.editorial-intro p{max-width:760px!important;}

/* Keep the homepage hero balanced; on desktop the text sits in its column, on mobile it stays below the card. */
.hero-copy{
  text-align:center!important;
  justify-self:center!important;
}
.hero-copy h1,
.hero-copy p,
.hero-copy .hero-kicker{
  text-align:center!important;
  margin-left:auto!important;
  margin-right:auto!important;
}
.hero-points{justify-content:center!important;}
.hero-product-status{justify-content:center!important;}

/* Blog controls and counts should visually align with the centered page titles. */
.filterbar,
.blog-count,
.article-meta-box,
.article .meta,
.article > .last-updated{
  text-align:center!important;
  justify-content:center!important;
  margin-left:auto!important;
  margin-right:auto!important;
}

/* Card polish: remove pure white boxes, use the warm paper surface, and force subtle 1px radius. */
.card,
.articlecard,
.support-card,
.support-option,
.paypal-support-box,
.donation-card,
.home-support-panel,
.offline-download-panel,
.about-summary,
.operator-card,
.contact-card,
.contact-method,
.pillar,
.consent-panel,
.language-switcher__menu,
.navlinks,
.input-with-icon,
.result,
.result.featured,
.ad-placement,
.address-highlight,
.install-app-dialog__card,
.paypal-recipient,
.cookie-settings-link,
.filter-btn,
.github-link{
  border-radius:1px!important;
}
.card,
.articlecard,
.support-card,
.support-option,
.paypal-support-box,
.donation-card,
.home-support-panel,
.offline-download-panel,
.about-summary,
.operator-card,
.contact-card,
.contact-method,
.pillar,
.install-app-dialog__card,
.paypal-recipient{
  background:var(--card-surface)!important;
  border-color:var(--line)!important;
  box-shadow:none!important;
}
.input-with-icon,
.result,
.generator-shell,
.consent-panel,
.language-switcher__menu{
  background:var(--card-surface-strong)!important;
  border-radius:1px!important;
}
.result.featured{background:#f3f1ea!important;}
.ad-placement{background:transparent!important;}

/* The editorial grid should still feel aligned, but each item is now a visible warm card. */
.cards,
.articlegrid{
  gap:14px!important;
  border:0!important;
  background:transparent!important;
}
.card,
.articlecard{
  border:1px solid var(--line)!important;
  border-right:1px solid var(--line)!important;
  border-bottom:1px solid var(--line)!important;
}
.articlecard:hover,
.card:hover{background:#f4efe5!important;}

/* Mobile polish: keep everything centered and avoid off-looking narrow headings. */
@media(max-width:850px){
  .home .hero-copy,
  .hero-copy,
  .page-hero,
  .sectionhead,
  .editorial-intro{text-align:center!important;}
  .outline-cta{margin-left:auto!important;margin-right:auto!important;}
}
@media(max-width:650px){
  .page-hero.wrap{width:min(100% - 24px,1120px)!important;}
  .page-hero{padding-left:18px!important;padding-right:18px!important;}
  .cards,.articlegrid{gap:12px!important;}
  .card,.articlecard{padding:1.65rem!important;}
}


/* 2026-06-19: merge page hero into article/content flow
   Removes the separated hero-band feeling on inner pages and keeps H1s smaller. */
.page-hero,
.page-hero.wrap{
  background:transparent!important;
  color:var(--ink)!important;
  padding:0!important;
  margin:0!important;
  border:0!important;
}

.article{
  padding-top:clamp(2.5rem,5vw,4.2rem)!important;
}
.article-head,
.blog-head,
.support-head{
  width:100%;
  max-width:760px;
  margin:0 auto 2.25rem!important;
  padding:0 0 1.65rem!important;
  border-bottom:1px solid var(--line);
  background:transparent!important;
  color:var(--ink)!important;
  text-align:left!important;
}
.article-head .eyebrow,
.blog-head .eyebrow,
.support-head .eyebrow{
  display:block;
  margin:0 0 .9rem!important;
  color:var(--accent)!important;
  text-align:left!important;
}
.article-head h1,
.blog-head h1,
.support-head h1,
.article > h1{
  max-width:760px!important;
  margin:0 0 .85rem!important;
  color:var(--ink)!important;
  font-family:'Cormorant Garamond',Georgia,serif!important;
  font-size:clamp(2rem,4vw,3rem)!important;
  line-height:1.12!important;
  letter-spacing:-.025em!important;
  font-weight:300!important;
  text-align:left!important;
}
.article-head p,
.blog-head p,
.support-head p{
  max-width:62ch!important;
  margin:0!important;
  color:var(--muted)!important;
  font-size:1rem!important;
  line-height:1.85!important;
  text-align:left!important;
}

/* Blog/support headers now live inside content, not in a separate page band. */
.blog-section,
.support-section{
  padding-top:clamp(2.5rem,5vw,4.2rem)!important;
}
.blog-head{
  max-width:880px;
  margin-left:auto!important;
  margin-right:auto!important;
}
.support-head{
  grid-column:1 / -1;
  max-width:760px;
}

/* Keep normal content headings premium but not oversized. */
.article h2{
  font-size:clamp(1.65rem,3vw,2.25rem)!important;
  line-height:1.16!important;
  margin-top:2.65rem!important;
}
.article h3{
  font-size:clamp(1.25rem,2.2vw,1.55rem)!important;
  line-height:1.22!important;
}
.sectionhead h1,
.sectionhead h2,
.editorial-intro h1,
.editorial-intro h2{
  font-size:clamp(1.9rem,3.8vw,2.9rem)!important;
  line-height:1.12!important;
}

/* Warm cards remain flat, with exact 1px radius. */
.card,
.articlecard,
.support-card,
.support-option,
.paypal-support-box,
.donation-card,
.home-support-panel,
.offline-download-panel,
.about-summary,
.operator-card,
.contact-card,
.contact-method,
.pillar,
.input-with-icon,
.result,
.generator-shell,
.consent-panel,
.language-switcher__menu,
.navlinks,
.filter-btn,
.github-link,
.btn,
.copy,
.outline-cta{
  border-radius:1px!important;
}
.card,
.articlecard,
.support-card,
.support-option,
.paypal-support-box,
.donation-card,
.home-support-panel,
.offline-download-panel,
.about-summary,
.operator-card,
.contact-card,
.contact-method,
.pillar{
  background:var(--card-surface,#fffaf1)!important;
  border:1px solid var(--line)!important;
  box-shadow:none!important;
}

@media(max-width:850px){
  .article,
  .blog-section,
  .support-section{
    padding-top:2rem!important;
  }
  .article-head,
  .blog-head,
  .support-head{
    margin-bottom:1.85rem!important;
  }
  .article-head h1,
  .blog-head h1,
  .support-head h1,
  .article > h1{
    font-size:clamp(1.9rem,9vw,2.65rem)!important;
  }
}


/* === Final polish: offline download panel, footer, and green Kardix icon style === */
.offline-download-section{
  background:var(--paper,#f5f2ec)!important;
  border-top:1px solid var(--line,rgba(15,14,12,.12))!important;
  border-bottom:1px solid var(--line,rgba(15,14,12,.12))!important;
}
.offline-download-panel{
  background:linear-gradient(180deg,#fffaf1 0%,#eeeae2 100%)!important;
  border:1px solid var(--line,rgba(15,14,12,.12))!important;
  border-radius:1px!important;
  box-shadow:none!important;
  color:var(--ink,#0f0e0c)!important;
}
.offline-download-copy h2{
  font-family:'Cormorant Garamond',Georgia,serif!important;
  font-weight:300!important;
  font-size:clamp(2rem,3.4vw,2.8rem)!important;
  line-height:1.08!important;
  letter-spacing:-.02em!important;
  color:var(--ink,#0f0e0c)!important;
}
.offline-download-copy p,
.offline-download-note{
  color:var(--muted,#6b6560)!important;
}
.offline-download-actions{
  align-items:stretch!important;
}
.download-app-button,
.download-app-button:disabled{
  background:var(--accent,#2d4a3e)!important;
  color:var(--paper,#f5f2ec)!important;
  border:1px solid var(--accent,#2d4a3e)!important;
  border-radius:1px!important;
  box-shadow:none!important;
  font-family:'DM Mono',ui-monospace,SFMono-Regular,Consolas,monospace!important;
  font-size:.72rem!important;
  font-weight:400!important;
  letter-spacing:.12em!important;
  text-transform:uppercase!important;
}
.download-app-button:hover:not(:disabled),
.download-app-button:focus-visible:not(:disabled){
  background:var(--accent-light,#4a7c6f)!important;
  border-color:var(--accent-light,#4a7c6f)!important;
  transform:none!important;
  box-shadow:none!important;
}
.download-app-button:focus-visible{
  outline:2px solid rgba(45,74,62,.28)!important;
  outline-offset:3px!important;
}
.download-app-button__icon{
  width:17px!important;
  height:17px!important;
}

.footer{
  background:var(--ink,#0f0e0c)!important;
  color:rgba(245,242,236,.72)!important;
  border-top:1px solid rgba(245,242,236,.12)!important;
  padding:0!important;
}
.footer .trust-strip{
  background:rgba(245,242,236,.035)!important;
  border-bottom:1px solid rgba(245,242,236,.12)!important;
  margin:0!important;
  padding:1rem 0!important;
}
.footer .trust-strip .wrap{
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:1rem!important;
}
.footer .trust-strip p{
  margin:0!important;
  color:rgba(245,242,236,.66)!important;
  font-size:.82rem!important;
}
.footer .trust-strip strong{color:var(--paper,#f5f2ec)!important;font-weight:400!important}
.footer .trust-strip .last-updated{
  font-family:'DM Mono',ui-monospace,SFMono-Regular,Consolas,monospace!important;
  font-size:.68rem!important;
  letter-spacing:.08em!important;
  text-transform:uppercase!important;
  color:rgba(245,242,236,.45)!important;
  white-space:nowrap!important;
}
.footer .footgrid{
  display:grid!important;
  grid-template-columns:minmax(180px,1fr) minmax(260px,auto) auto!important;
  align-items:center!important;
  gap:2rem!important;
  padding:2.2rem 0!important;
}
.footer strong{
  font-family:'Cormorant Garamond',Georgia,serif!important;
  font-size:1.75rem!important;
  font-weight:300!important;
  letter-spacing:.02em!important;
  color:var(--paper,#f5f2ec)!important;
}
.footer small{
  color:rgba(245,242,236,.48)!important;
  font-size:.86rem!important;
}
.footer .footlinks{
  display:flex!important;
  justify-content:flex-end!important;
  align-items:center!important;
  gap:1.1rem!important;
  flex-wrap:wrap!important;
  font-family:'DM Mono',ui-monospace,SFMono-Regular,Consolas,monospace!important;
  font-size:.68rem!important;
  letter-spacing:.1em!important;
  text-transform:uppercase!important;
}
.footer a{
  color:rgba(245,242,236,.72)!important;
  text-decoration:none!important;
}
.footer a:hover{color:var(--paper,#f5f2ec)!important}
.footer .cookie-settings-link{
  justify-self:end!important;
  background:transparent!important;
  border:1px solid rgba(245,242,236,.22)!important;
  border-radius:1px!important;
  color:rgba(245,242,236,.72)!important;
  padding:.72rem .9rem!important;
  font-family:'DM Mono',ui-monospace,SFMono-Regular,Consolas,monospace!important;
  font-size:.64rem!important;
  letter-spacing:.1em!important;
  text-transform:uppercase!important;
  box-shadow:none!important;
}
.footer .cookie-settings-link:hover{
  background:var(--accent,#2d4a3e)!important;
  border-color:var(--accent,#2d4a3e)!important;
  color:var(--paper,#f5f2ec)!important;
}
@media(max-width:900px){
  .footer .trust-strip .wrap,
  .footer .footgrid{
    display:grid!important;
    grid-template-columns:1fr!important;
    justify-items:center!important;
    text-align:center!important;
  }
  .footer .footlinks{justify-content:center!important}
  .footer .cookie-settings-link{justify-self:center!important}
  .footer .trust-strip .last-updated{white-space:normal!important}
  .offline-download-panel{grid-template-columns:1fr!important;text-align:left!important}
}


/* === Footer layout refinement v25 === */
.footer{
  background:var(--ink,#0f0e0c)!important;
  color:rgba(245,242,236,.72)!important;
  border-top:1px solid rgba(245,242,236,.12)!important;
  padding:0!important;
}
.footer .trust-strip{
  background:rgba(245,242,236,.035)!important;
  border-bottom:1px solid rgba(245,242,236,.11)!important;
  margin:0!important;
  padding:.95rem 0!important;
}
.footer .trust-strip .wrap{
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:1.25rem!important;
}
.footer .trust-strip p{
  margin:0!important;
  color:rgba(245,242,236,.64)!important;
  font-size:.82rem!important;
  line-height:1.6!important;
}
.footer .trust-strip strong{
  color:var(--paper,#f5f2ec)!important;
  font-weight:400!important;
}
.footer .trust-strip .last-updated{
  font-family:'DM Mono',ui-monospace,SFMono-Regular,Consolas,monospace!important;
  font-size:.66rem!important;
  letter-spacing:.1em!important;
  text-transform:uppercase!important;
  color:rgba(245,242,236,.42)!important;
  white-space:nowrap!important;
}
.footer .footer-main{
  display:grid!important;
  grid-template-columns:minmax(250px,1.35fr) minmax(130px,.7fr) minmax(160px,.8fr) minmax(150px,.75fr)!important;
  gap:3rem!important;
  align-items:start!important;
  padding:3.35rem 0 2.8rem!important;
}
.footer .footer-brand-block{
  max-width:390px!important;
}
.footer .footer-brand{
  display:inline-flex!important;
  align-items:center!important;
  gap:.85rem!important;
  text-decoration:none!important;
  color:var(--paper,#f5f2ec)!important;
  margin-bottom:1.15rem!important;
}
.footer .footer-brand .logo-mark,
.footer .logo-mark{
  display:inline-grid!important;
  place-items:center!important;
  width:2.35rem!important;
  height:2.35rem!important;
  border:1px solid rgba(245,242,236,.2)!important;
  background:var(--accent,#2d4a3e)!important;
  color:var(--paper,#f5f2ec)!important;
  border-radius:1px!important;
  font-family:'Cormorant Garamond',Georgia,serif!important;
  font-size:1.35rem!important;
  font-weight:600!important;
  line-height:1!important;
}
.footer .footer-brand-text{
  display:flex!important;
  flex-direction:column!important;
  gap:.08rem!important;
}
.footer strong{
  font-family:'Cormorant Garamond',Georgia,serif!important;
  font-size:1.65rem!important;
  font-weight:300!important;
  letter-spacing:.02em!important;
  color:var(--paper,#f5f2ec)!important;
  line-height:1.05!important;
}
.footer small,
.footer .footer-brand small{
  color:rgba(245,242,236,.48)!important;
  font-size:.82rem!important;
  line-height:1.5!important;
}
.footer .footer-copy{
  max-width:34ch!important;
  margin:0!important;
  color:rgba(245,242,236,.56)!important;
  font-size:.92rem!important;
  line-height:1.85!important;
}
.footer .footer-column{
  display:flex!important;
  flex-direction:column!important;
  align-items:flex-start!important;
  gap:.72rem!important;
  min-width:0!important;
}
.footer .footer-column h2{
  margin:0 0 .45rem!important;
  font-family:'DM Mono',ui-monospace,SFMono-Regular,Consolas,monospace!important;
  font-size:.66rem!important;
  font-weight:400!important;
  letter-spacing:.16em!important;
  text-transform:uppercase!important;
  color:var(--warm,#c8b89a)!important;
  line-height:1.4!important;
}
.footer .footer-column a,
.footer .footlinks a,
.footer a{
  color:rgba(245,242,236,.72)!important;
  text-decoration:none!important;
  font-family:'DM Sans',Inter,system-ui,sans-serif!important;
  font-size:.9rem!important;
  font-weight:300!important;
  line-height:1.45!important;
  letter-spacing:0!important;
  text-transform:none!important;
  transition:color .18s ease, transform .18s ease!important;
}
.footer .footer-column a:hover,
.footer a:hover{
  color:var(--paper,#f5f2ec)!important;
  transform:translateX(2px)!important;
}
.footer .privacy-primary{
  color:var(--paper,#f5f2ec)!important;
}
.footer .cookie-settings-link{
  margin-top:.35rem!important;
  align-self:flex-start!important;
  justify-self:auto!important;
  background:transparent!important;
  border:1px solid rgba(245,242,236,.22)!important;
  border-radius:1px!important;
  color:rgba(245,242,236,.72)!important;
  padding:.65rem .78rem!important;
  font-family:'DM Mono',ui-monospace,SFMono-Regular,Consolas,monospace!important;
  font-size:.61rem!important;
  font-weight:400!important;
  letter-spacing:.11em!important;
  text-transform:uppercase!important;
  line-height:1.2!important;
  box-shadow:none!important;
  cursor:pointer!important;
}
.footer .cookie-settings-link:hover,
.footer .cookie-settings-link:focus-visible{
  background:var(--accent,#2d4a3e)!important;
  border-color:var(--accent,#2d4a3e)!important;
  color:var(--paper,#f5f2ec)!important;
  outline:none!important;
}
.footer .footer-bottom{
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:1rem!important;
  padding:1.15rem 0!important;
  border-top:1px solid rgba(245,242,236,.1)!important;
}
.footer .footer-bottom small,
.footer .footer-bottom span{
  color:rgba(245,242,236,.42)!important;
  font-family:'DM Mono',ui-monospace,SFMono-Regular,Consolas,monospace!important;
  font-size:.64rem!important;
  letter-spacing:.08em!important;
  text-transform:uppercase!important;
}
.footer .footgrid,
.footer .footlinks{
  display:contents!important;
}
@media(max-width:980px){
  .footer .footer-main{
    grid-template-columns:1.25fr 1fr 1fr!important;
    gap:2.4rem!important;
  }
  .footer .footer-brand-block{
    grid-column:1 / -1!important;
    max-width:620px!important;
  }
  .footer .footer-copy{max-width:58ch!important}
}
@media(max-width:700px){
  .footer .trust-strip .wrap{
    display:grid!important;
    grid-template-columns:1fr!important;
    justify-items:start!important;
    text-align:left!important;
    gap:.35rem!important;
  }
  .footer .trust-strip .last-updated{white-space:normal!important}
  .footer .footer-main{
    grid-template-columns:1fr 1fr!important;
    gap:2.2rem 1.35rem!important;
    padding:2.5rem 0 2.15rem!important;
  }
  .footer .footer-brand-block{
    grid-column:1 / -1!important;
  }
  .footer .footer-legal{
    grid-column:1 / -1!important;
    border-top:1px solid rgba(245,242,236,.1)!important;
    padding-top:1.4rem!important;
  }
  .footer .footer-bottom{
    display:grid!important;
    grid-template-columns:1fr!important;
    justify-items:start!important;
    text-align:left!important;
  }
}
@media(max-width:460px){
  .footer .footer-main{
    grid-template-columns:1fr!important;
  }
  .footer .footer-column,
  .footer .cookie-settings-link{
    width:100%!important;
  }
  .footer .footer-column a{
    padding:.08rem 0!important;
  }
}

/* === About summary favicon icon refinement v26 === */
.about-summary{
  grid-template-columns:96px minmax(0,1fr)!important;
}
.about-summary .about-summary-icon{
  width:96px!important;
  height:96px!important;
  display:grid!important;
  place-items:center!important;
  border:1px solid var(--border,rgba(15,14,12,.12))!important;
  background:var(--accent,#2d4a3e)!important;
  border-radius:1px!important;
  box-shadow:none!important;
}
.about-summary .about-summary-icon img{
  width:58px!important;
  height:58px!important;
  display:block!important;
  border:0!important;
  border-radius:0!important;
  background:transparent!important;
  object-fit:contain!important;
  margin:0!important;
}
@media(max-width:650px){
  .about-summary{
    grid-template-columns:1fr!important;
    justify-items:center!important;
  }
  .about-summary .about-summary-icon{
    margin:0 auto .35rem!important;
  }
}

/* === Outline CTA theme polish v27 === */
.outline-cta,
.home .outline-cta{
  background:var(--paper,#f5f2ec)!important;
  color:var(--accent,#2d4a3e)!important;
  border:1px solid var(--accent,#2d4a3e)!important;
  border-radius:1px!important;
  box-shadow:none!important;
  font-family:'DM Mono',ui-monospace,SFMono-Regular,Consolas,monospace!important;
  font-weight:400!important;
  letter-spacing:.1em!important;
  text-transform:uppercase!important;
  transition:background .18s ease,border-color .18s ease,color .18s ease,transform .18s ease!important;
}
.outline-cta:hover,
.outline-cta:focus-visible,
.home .outline-cta:hover,
.home .outline-cta:focus-visible{
  background:var(--accent,#2d4a3e)!important;
  border-color:var(--accent,#2d4a3e)!important;
  color:var(--paper,#f5f2ec)!important;
  transform:translateX(4px)!important;
  outline:none!important;
}
.outline-cta span,
.home .outline-cta span{
  color:inherit!important;
}



/* 2026-06-19: force homepage title to exactly two clean lines. */
.home .hero-copy h1.hero-title-two-line{
  display:block!important;
  width:max-content!important;
  max-width:100%!important;
  margin-left:auto!important;
  margin-right:auto!important;
  font-size:clamp(36px,3.55vw,46px)!important;
  line-height:1.02!important;
  text-wrap:balance;
}
.home .hero-copy h1.hero-title-two-line span{
  display:block!important;
  white-space:nowrap!important;
}
@media(max-width:850px){
  .home .hero-copy h1.hero-title-two-line{
    font-size:clamp(30px,7.1vw,42px)!important;
  }
}
@media(max-width:520px){
  .home .hero-copy h1.hero-title-two-line{
    font-size:clamp(23px,7.2vw,34px)!important;
    line-height:1.05!important;
  }
}
@media(max-width:360px){
  .home .hero-copy h1.hero-title-two-line{
    font-size:clamp(21px,6.8vw,25px)!important;
    letter-spacing:-.018em!important;
  }
}

/* 2026-06-19: right-side homepage hero H1 clamp requested, corrected CSS order: min, preferred, max. */
.home .hero-copy h1.hero-title-two-line{
  font-size:clamp(20px,4vw,38px)!important;
}

/* 2026-06-19: keep the right-side homepage hero block readable left-to-right. */
.home .hero-copy{
  text-align:left!important;
  justify-self:start!important;
}
.home .hero-kicker{
  justify-content:flex-start!important;
  flex-direction:row!important;
}
.home .hero-copy h1.hero-title-two-line{
  margin-left:0!important;
  margin-right:auto!important;
  text-align:left!important;
}
.home .hero-copy>p,
.home .hero-points,
.home .hero-product-status{
  margin-left:0!important;
  margin-right:auto!important;
}
.home .hero-points{
  justify-content:flex-start!important;
}
.home .hero-points>span{
  justify-content:flex-start!important;
  text-align:left!important;
  flex-direction:row!important;
}
.home .outline-cta{
  margin-left:0!important;
  margin-right:auto!important;
}
@media(max-width:850px){
  .home .hero-copy{
    justify-self:center!important;
  }
}

/* 2026-06-19: final homepage right hero alignment fix.
   Make every right-side hero text, badges, status row, and CTA start left-to-right. */
body.home .hero-copy,
body.home .hero-copy *{
  text-align:left!important;
}
body.home .hero-copy{
  display:flex!important;
  flex-direction:column!important;
  align-items:flex-start!important;
  justify-self:start!important;
}
body.home .hero-kicker,
body.home .hero-copy h1,
body.home .hero-copy h1.hero-title-two-line,
body.home .hero-copy>p,
body.home .hero-points,
body.home .hero-product-status,
body.home .outline-cta{
  margin-left:0!important;
  margin-right:auto!important;
}
body.home .hero-kicker,
body.home .hero-points,
body.home .hero-points>span,
body.home .hero-product-status,
body.home .hero-product-status span,
body.home .outline-cta{
  justify-content:flex-start!important;
  align-items:center!important;
}
body.home .hero-kicker{
  align-self:flex-start!important;
}
body.home .hero-copy h1.hero-title-two-line{
  width:auto!important;
  max-width:100%!important;
}
body.home .hero-copy h1.hero-title-two-line span{
  display:block!important;
  width:auto!important;
  max-width:100%!important;
}
body.home .outline-cta{
  align-self:flex-start!important;
}
@media(max-width:850px){
  body.home .hero-copy{
    align-items:flex-start!important;
    justify-self:center!important;
  }
  body.home .hero-points,
  body.home .hero-product-status{
    justify-content:flex-start!important;
  }
}


/* Static German language links */
.de-static-language{display:flex;align-items:center;gap:.35rem;white-space:nowrap}
.de-static-language .de-language-link{display:flex;align-items:center;gap:.32rem;text-decoration:none;color:inherit;border:1px solid rgba(45,74,62,.16);border-radius:999px;padding:.45rem .65rem;background:rgba(255,255,255,.72);font-size:.86rem;font-weight:700}
.de-static-language .de-language-link.is-selected{background:rgba(45,74,62,.10)}
.de-static-language .language-switcher__check{font-size:.78rem}
@media (max-width:720px){.de-static-language .de-language-link span:not(.language-switcher__code):not(.language-switcher__check){display:none}.de-static-language .de-language-link{padding:.42rem .52rem}}


/* 2026-06-19: German article category filter polish.
   German static article pages use the same controls/classes as English. */
.filterbar button.filter-btn,
.filterbar .filter-btn{
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  min-height:42px!important;
  border:1px solid var(--line)!important;
  background:var(--card-surface)!important;
  color:var(--ink)!important;
  border-radius:999px!important;
  padding:.62rem 1rem!important;
  font-size:.88rem!important;
  font-weight:700!important;
  letter-spacing:.01em!important;
  cursor:pointer!important;
  transition:background .18s ease,border-color .18s ease,color .18s ease,transform .18s ease!important;
}
.filterbar button.filter-btn:hover,
.filterbar button.filter-btn.active,
.filterbar .filter-btn:hover,
.filterbar .filter-btn.active{
  background:var(--blue)!important;
  border-color:var(--blue)!important;
  color:#fff!important;
  transform:translateY(-1px)!important;
}
html[lang="de"] .filterbar{
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:.65rem!important;
  flex-wrap:wrap!important;
  margin:0 auto 1.2rem!important;
  max-width:920px!important;
}
html[lang="de"] .blog-count{
  text-align:center!important;
  color:var(--muted)!important;
  font-size:.92rem!important;
  margin:0 auto 2rem!important;
}
html[lang="de"] .articlecard small{
  display:inline-flex!important;
  width:max-content!important;
  max-width:100%!important;
  align-items:center!important;
  border:1px solid rgba(47,128,237,.2)!important;
  background:#eef6ff!important;
  color:var(--blue-deep)!important;
  border-radius:999px!important;
  padding:.28rem .58rem!important;
  margin:0 0 .9rem!important;
  font-size:.66rem!important;
  font-weight:800!important;
  letter-spacing:.08em!important;
  text-transform:uppercase!important;
}
@media(max-width:650px){
  html[lang="de"] .filterbar{
    justify-content:flex-start!important;
    overflow-x:auto!important;
    flex-wrap:nowrap!important;
    padding-bottom:.35rem!important;
    -webkit-overflow-scrolling:touch!important;
  }
  html[lang="de"] .filterbar .filter-btn{
    flex:0 0 auto!important;
    white-space:nowrap!important;
  }
}

/* 2026-06-19: keep German article category filters in the original sharp style.
   No white pill background; 1px radius; active state uses the site accent color. */
html[lang="de"] .filterbar{
  justify-content:flex-start!important;
  align-items:center!important;
  gap:.55rem!important;
  flex-wrap:wrap!important;
  max-width:none!important;
  margin:0 0 2.5rem!important;
}
html[lang="de"] .filterbar button.filter-btn,
html[lang="de"] .filterbar .filter-btn{
  min-height:auto!important;
  border:1px solid var(--line)!important;
  background:transparent!important;
  color:var(--muted)!important;
  border-radius:1px!important;
  padding:.58rem .85rem!important;
  font-family:'DM Mono',ui-monospace,monospace!important;
  font-size:.72rem!important;
  letter-spacing:.1em!important;
  text-transform:uppercase!important;
  font-weight:300!important;
  line-height:1.2!important;
  transform:none!important;
}
html[lang="de"] .filterbar button.filter-btn:hover,
html[lang="de"] .filterbar button.filter-btn.active,
html[lang="de"] .filterbar .filter-btn:hover,
html[lang="de"] .filterbar .filter-btn.active{
  background:var(--accent)!important;
  border-color:var(--accent)!important;
  color:#fff!important;
  border-radius:1px!important;
  transform:none!important;
}
html[lang="de"] .articlecard small{
  display:block!important;
  width:auto!important;
  max-width:100%!important;
  border:0!important;
  background:transparent!important;
  color:var(--warm)!important;
  border-radius:1px!important;
  padding:0!important;
  margin:0 0 .95rem!important;
  font-family:'DM Mono',ui-monospace,monospace!important;
  font-size:.66rem!important;
  font-weight:300!important;
  letter-spacing:.1em!important;
  text-transform:uppercase!important;
}
html[lang="de"] .blog-count{
  text-align:left!important;
  margin:-1.4rem 0 2rem!important;
  font-family:'DM Mono',ui-monospace,monospace!important;
  font-size:.68rem!important;
  letter-spacing:.08em!important;
  text-transform:uppercase!important;
}
@media(max-width:650px){
  html[lang="de"] .filterbar{
    justify-content:flex-start!important;
    overflow-x:auto!important;
    flex-wrap:nowrap!important;
    padding-bottom:.35rem!important;
    -webkit-overflow-scrolling:touch!important;
  }
  html[lang="de"] .filterbar .filter-btn{
    flex:0 0 auto!important;
    white-space:nowrap!important;
  }
}


/* 2026-06-19: Passphrase and PIN checker tools */
.tool-page .tool-hero{background:var(--ink);color:var(--paper)}
.tool-layout{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(280px,.75fr);gap:2rem;align-items:start}
.tool-panel,.tool-side{border:1px solid var(--line);background:transparent;padding:2.4rem;border-radius:1px}
.tool-head{margin:0 0 1.4rem!important;max-width:none!important}
.tool-head h2{font-size:clamp(2rem,3.4vw,3rem)!important}
.tool-check{display:flex;align-items:flex-start;gap:.7rem;margin:1rem 0 1.2rem;color:var(--ink);font-size:.98rem;line-height:1.55;cursor:pointer}
.tool-check input{accent-color:var(--accent);width:1.05rem;height:1.05rem;margin-top:.25rem;flex:0 0 auto}
.tool-pin-field{margin-top:.4rem}
.score-box{margin-top:1.6rem;border:1px solid var(--line);background:#fffdf8;padding:1.4rem;border-radius:1px}
.score-top{display:flex;align-items:center;justify-content:space-between;gap:1rem;font-family:'DM Mono',ui-monospace,monospace;font-size:.78rem;letter-spacing:.1em;text-transform:uppercase;color:var(--ink)}
.score-top span{color:var(--accent)}
.score-meter{height:10px;border:1px solid var(--line);background:#eeeae2;margin:1rem 0 1rem;overflow:hidden;border-radius:1px}
.score-meter span{display:block;height:100%;width:0;background:var(--accent);transition:width .18s ease}
.score-verdict{font-family:'Cormorant Garamond',Georgia,serif;font-size:1.45rem;line-height:1.35;color:var(--ink);margin:.6rem 0 1rem}
.score-tips{margin:0;padding-left:1.15rem;color:var(--muted)}
.score-tips li{margin:.35rem 0;line-height:1.65}
.tool-side h2{font-family:'Cormorant Garamond',Georgia,serif;font-weight:300;font-size:2rem;line-height:1.1;margin:0 0 1rem;color:var(--ink)}
.tool-side p{color:var(--muted);line-height:1.9;margin:0 0 1rem}
.tool-side .btn{display:inline-flex;margin-top:.7rem}
.home-tool-links .articlecard strong{display:block;margin-top:1.1rem;color:var(--accent);font-family:'DM Mono',ui-monospace,monospace;font-size:.72rem;letter-spacing:.1em;text-transform:uppercase;font-weight:300}
@media(max-width:850px){.tool-layout{grid-template-columns:1fr}.tool-panel,.tool-side{padding:1.8rem}.tool-page .page-hero{padding-top:4.4rem;padding-bottom:4.4rem}}


/* 2026-06-19: Final checker tool CSS fix.
   The checker pages must override older global centering/hero/card rules and load with a new filename to avoid old service-worker cache. */
body.tool-page main{
  background:var(--paper,#f5f2ec)!important;
  color:var(--ink,#0f0e0c)!important;
}
body.tool-page .page-hero.tool-hero{
  display:block!important;
  background:var(--paper,#f5f2ec)!important;
  color:var(--ink,#0f0e0c)!important;
  padding:clamp(3rem,6vw,5.25rem) 0 1.75rem!important;
  margin:0!important;
  border:0!important;
  text-align:left!important;
}
body.tool-page .page-hero.tool-hero .wrap{
  width:min(1120px,calc(100% - 36px))!important;
  margin-left:auto!important;
  margin-right:auto!important;
}
body.tool-page .page-hero.tool-hero .eyebrow,
body.tool-page .page-hero.tool-hero h1,
body.tool-page .page-hero.tool-hero p{
  display:block!important;
  margin-left:0!important;
  margin-right:0!important;
  text-align:left!important;
}
body.tool-page .page-hero.tool-hero .eyebrow{
  color:var(--accent,#2d4a3e)!important;
  margin-bottom:.85rem!important;
}
body.tool-page .page-hero.tool-hero h1{
  max-width:780px!important;
  color:var(--ink,#0f0e0c)!important;
  font-family:'Cormorant Garamond',Georgia,serif!important;
  font-weight:300!important;
  font-size:clamp(2.45rem,5vw,4.35rem)!important;
  line-height:1.03!important;
  letter-spacing:-.035em!important;
  margin:0 0 1rem!important;
}
body.tool-page .page-hero.tool-hero p{
  max-width:720px!important;
  color:var(--muted,#6b6560)!important;
  font-size:1rem!important;
  line-height:1.9!important;
}
body.tool-page main>.section{
  padding:2.25rem 0 6rem!important;
  background:var(--paper,#f5f2ec)!important;
}
body.tool-page .tool-layout{
  display:grid!important;
  grid-template-columns:minmax(0,1.25fr) minmax(280px,.75fr)!important;
  gap:2rem!important;
  align-items:start!important;
}
body.tool-page .tool-panel,
body.tool-page .tool-side{
  display:block!important;
  border:1px solid var(--line,rgba(15,14,12,.12))!important;
  background:var(--card-surface,#fffaf1)!important;
  color:var(--ink,#0f0e0c)!important;
  padding:clamp(1.6rem,3vw,2.4rem)!important;
  border-radius:1px!important;
  box-shadow:none!important;
}
body.tool-page .tool-panel .sectionhead,
body.tool-page .tool-panel .tool-head{
  max-width:none!important;
  margin:0 0 1.5rem!important;
  padding:0!important;
  text-align:left!important;
}
body.tool-page .tool-panel .sectionhead .eyebrow,
body.tool-page .tool-panel .sectionhead h1,
body.tool-page .tool-panel .sectionhead h2,
body.tool-page .tool-panel .sectionhead p{
  margin-left:0!important;
  margin-right:0!important;
  text-align:left!important;
}
body.tool-page .tool-panel .sectionhead h2{
  color:var(--ink,#0f0e0c)!important;
  font-family:'Cormorant Garamond',Georgia,serif!important;
  font-size:clamp(2rem,3.4vw,3rem)!important;
  font-weight:300!important;
  line-height:1.08!important;
  letter-spacing:-.025em!important;
  margin:.55rem 0 .75rem!important;
}
body.tool-page .tool-panel .sectionhead p{
  color:var(--muted,#6b6560)!important;
  max-width:62ch!important;
  line-height:1.85!important;
}
body.tool-page .field{
  display:block!important;
  margin:1rem 0!important;
}
body.tool-page .field>span{
  display:block!important;
  color:var(--muted,#6b6560)!important;
  font-family:'DM Mono',ui-monospace,SFMono-Regular,Consolas,monospace!important;
  font-size:.68rem!important;
  letter-spacing:.1em!important;
  text-transform:uppercase!important;
  font-weight:300!important;
  margin:0 0 .55rem!important;
}
body.tool-page .input-with-icon{
  display:flex!important;
  align-items:center!important;
  width:100%!important;
  height:54px!important;
  border:1px solid var(--line,rgba(15,14,12,.12))!important;
  background:var(--card-surface-strong,#fffdf8)!important;
  border-radius:1px!important;
  overflow:hidden!important;
}
body.tool-page .input-with-icon>span{
  width:48px!important;
  flex:0 0 48px!important;
  text-align:center!important;
  color:var(--accent,#2d4a3e)!important;
  border-right:1px solid var(--line,rgba(15,14,12,.12))!important;
}
body.tool-page .input-with-icon input{
  display:block!important;
  min-width:0!important;
  flex:1 1 auto!important;
  height:100%!important;
  border:0!important;
  outline:0!important;
  background:transparent!important;
  color:var(--ink,#0f0e0c)!important;
  padding:0 1rem!important;
}
body.tool-page .tool-check{
  display:flex!important;
  align-items:flex-start!important;
  justify-content:flex-start!important;
  gap:.7rem!important;
  width:100%!important;
  margin:1rem 0 1.2rem!important;
  color:var(--ink,#0f0e0c)!important;
  font-size:.98rem!important;
  line-height:1.55!important;
  text-align:left!important;
  cursor:pointer!important;
}
body.tool-page .tool-check input{
  width:1.05rem!important;
  height:1.05rem!important;
  flex:0 0 auto!important;
  margin:.25rem 0 0!important;
  accent-color:var(--accent,#2d4a3e)!important;
}
body.tool-page .tool-pin-field[hidden]{display:none!important}
body.tool-page .score-box{
  margin-top:1.6rem!important;
  border:1px solid var(--line,rgba(15,14,12,.12))!important;
  background:var(--card-surface-strong,#fffdf8)!important;
  padding:1.4rem!important;
  border-radius:1px!important;
}
body.tool-page .score-top{
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:1rem!important;
  color:var(--ink,#0f0e0c)!important;
  font-family:'DM Mono',ui-monospace,SFMono-Regular,Consolas,monospace!important;
  font-size:.72rem!important;
  letter-spacing:.1em!important;
  text-transform:uppercase!important;
}
body.tool-page .score-top span{color:var(--accent,#2d4a3e)!important}
body.tool-page .score-meter{
  height:10px!important;
  border:1px solid var(--line,rgba(15,14,12,.12))!important;
  background:#eeeae2!important;
  margin:1rem 0!important;
  overflow:hidden!important;
  border-radius:1px!important;
}
body.tool-page .score-meter span{
  display:block!important;
  height:100%!important;
  width:0;
  background:var(--accent,#2d4a3e)!important;
  transition:width .18s ease!important;
}
body.tool-page .score-verdict{
  color:var(--ink,#0f0e0c)!important;
  font-family:'Cormorant Garamond',Georgia,serif!important;
  font-size:1.45rem!important;
  line-height:1.35!important;
  margin:.6rem 0 1rem!important;
  text-align:left!important;
}
body.tool-page .score-tips{
  margin:0!important;
  padding-left:1.15rem!important;
  color:var(--muted,#6b6560)!important;
  text-align:left!important;
}
body.tool-page .score-tips li{margin:.35rem 0!important;line-height:1.65!important}
body.tool-page .tool-side h2{
  color:var(--ink,#0f0e0c)!important;
  font-family:'Cormorant Garamond',Georgia,serif!important;
  font-weight:300!important;
  font-size:2rem!important;
  line-height:1.1!important;
  margin:0 0 1rem!important;
  text-align:left!important;
}
body.tool-page .tool-side p{
  color:var(--muted,#6b6560)!important;
  line-height:1.9!important;
  margin:0 0 1rem!important;
  text-align:left!important;
}
body.tool-page .tool-side .btn{
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  margin-top:.7rem!important;
}
body.tool-page .home-tool-links .articlecard strong{
  display:block!important;
  margin-top:1.1rem!important;
  color:var(--accent,#2d4a3e)!important;
  font-family:'DM Mono',ui-monospace,SFMono-Regular,Consolas,monospace!important;
  font-size:.72rem!important;
  letter-spacing:.1em!important;
  text-transform:uppercase!important;
  font-weight:300!important;
}
@media(max-width:850px){
  body.tool-page .page-hero.tool-hero{padding:3.5rem 0 1.25rem!important}
  body.tool-page .tool-layout{grid-template-columns:1fr!important;gap:1rem!important}
  body.tool-page .tool-panel,body.tool-page .tool-side{padding:1.55rem!important}
}
@media(max-width:520px){
  body.tool-page .page-hero.tool-hero .wrap,body.tool-page .tool-layout.wrap{width:min(100% - 24px,1120px)!important}
  body.tool-page .score-top{align-items:flex-start!important;flex-direction:column!important;gap:.35rem!important}
}