/* ==========================================================================
   FRONT PAGE RANKING — design system
   Ground: porcelain. Bands: deep ultramarine ink. Brand: electric blue.
   Action: signal orange. Display: Archivo (expanded). Body: Manrope.
   ========================================================================== */
:root{
  --porcelain:#eef1f8;
  --porcelain-2:#e5e9f5;
  --white:#ffffff;
  --ink:#070b28;
  --ink-2:#0e1444;
  --ink-3:#171f5c;
  --blue:#2340ff;
  --blue-hi:#5e74ff;
  --blue-deep:#1329c4;
  --blue-tint:#dfe4ff;
  --blue-wash:#f0f2ff;
  --orange:#ff4a14;
  --orange-hi:#ff7a45;
  --orange-wash:#fff0eb;
  --green:#00b87c;
  --gold:#ffb020;

  --text:#080d30;
  --text-2:#4b5580;
  --text-3:#8089ad;
  --line:#dde2f0;
  --line-2:#e9edf7;

  --on-dark:#eef1ff;
  --on-dark-2:#a3addd;
  --on-dark-3:#6f7ab0;
  --line-dark:rgba(255,255,255,.13);

  --wrap:1200px;
  --gut:clamp(20px,5vw,60px);

  --fs-hero:clamp(2.45rem,5.3vw,4.05rem);
  --fs-h1:clamp(2.3rem,5.2vw,4rem);
  --fs-h2:clamp(1.85rem,3.7vw,2.95rem);
  --fs-h3:clamp(1.1rem,1.45vw,1.32rem);
  --fs-lede:clamp(1.05rem,1.35vw,1.22rem);
  --fs-xs:.76rem;

  --r-s:8px; --r-m:14px; --r-l:22px; --r-xl:30px;
  --sh-s:0 2px 8px rgba(8,13,48,.06), 0 1px 2px rgba(8,13,48,.05);
  --sh-m:0 18px 42px -18px rgba(8,13,48,.24), 0 3px 10px rgba(8,13,48,.06);
  --sh-l:0 44px 90px -34px rgba(12,20,88,.44), 0 10px 28px -12px rgba(8,13,48,.16);
  --sh-blue:0 28px 70px -26px rgba(35,64,255,.52);
  --sh-orange:0 14px 34px -12px rgba(255,74,20,.5);
  --ease:cubic-bezier(.22,.61,.36,1);
  color-scheme:light;
}
*,*::before,*::after{box-sizing:border-box}

body{
  margin:0; background:var(--porcelain); color:var(--text);
  font-family:"Manrope","Helvetica Neue",Arial,sans-serif;
  font-size:16.5px; line-height:1.62; -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
h1,h2,h3,h4,.display{
  font-family:"Archivo","Helvetica Neue",Arial,sans-serif;
  font-variation-settings:"wdth" 112;
  font-weight:800; line-height:1.0; letter-spacing:-.032em;
  text-wrap:balance; margin:0; color:var(--text);
}
h3,h4{letter-spacing:-.022em; line-height:1.14}
p{margin:0}
a{color:inherit;text-decoration:none}
img{max-width:100%}
button,input,select,textarea{font:inherit;color:inherit}
:focus-visible{outline:3px solid var(--blue); outline-offset:2px; border-radius:4px}
::selection{background:var(--blue); color:#fff}

/* ---------- layout ---------- */
.wrap{width:100%; max-width:var(--wrap); margin-inline:auto; padding-inline:var(--gut)}
.band{padding-block:clamp(66px,8vw,120px); position:relative}
.band-tight{padding-block:clamp(48px,5.4vw,78px)}
.b-porcelain{background:var(--porcelain)}
.b-white{background:var(--white)}
.b-wash{background:var(--blue-wash)}
.b-ink{background:var(--ink); color:var(--on-dark)}
.b-ink h1,.b-ink h2,.b-ink h3,.b-ink h4{color:var(--white)}
.b-blue{background:var(--blue); color:#fff}
.b-blue h1,.b-blue h2,.b-blue h3{color:#fff}

.eyebrow{
  font-family:"JetBrains Mono",ui-monospace,monospace; font-size:var(--fs-xs);
  letter-spacing:.16em; text-transform:uppercase; color:var(--blue);
  display:inline-flex; align-items:center; gap:.65em; font-weight:500;
}
.eyebrow::before{content:""; width:20px; height:2px; background:var(--orange); border-radius:2px}
.b-ink .eyebrow,.b-blue .eyebrow{color:var(--orange-hi)}
.b-blue .eyebrow::before{background:#fff}
.h2{font-size:var(--fs-h2)}
.lede{font-size:var(--fs-lede); color:var(--text-2); max-width:62ch; line-height:1.58}
.b-ink .lede{color:var(--on-dark-2)} .b-blue .lede{color:rgba(255,255,255,.84)}
.sec-head{max-width:800px; display:flex; flex-direction:column; gap:1.05rem; margin-bottom:clamp(34px,4.4vw,60px)}
.sec-head.center{margin-inline:auto; text-align:center; align-items:center}
.rule{height:1px; background:var(--line); border:0; margin:0}

/* ---------- buttons ---------- */
.btn{
  white-space:nowrap; display:inline-flex; align-items:center; justify-content:center; gap:.55em;
  padding:.95em 1.6em; border-radius:999px; border:2px solid transparent;
  font-weight:700; font-size:.95rem; letter-spacing:-.008em; cursor:pointer; text-align:center;
  transition:transform .22s var(--ease), box-shadow .22s var(--ease), background .22s var(--ease), border-color .22s var(--ease), color .22s var(--ease);
}
.btn svg{flex:none}
.btn-orange{background:var(--orange); color:#fff; box-shadow:var(--sh-orange)}
.btn-orange:hover{background:#ff3a00; transform:translateY(-2px); box-shadow:0 20px 44px -12px rgba(255,74,20,.62)}
.btn-blue{background:var(--blue); color:#fff; box-shadow:var(--sh-blue)}
.btn-blue:hover{background:var(--blue-deep); transform:translateY(-2px)}
.btn-dark{background:var(--ink); color:#fff}
.btn-dark:hover{background:var(--ink-3); transform:translateY(-2px)}
.btn-white{background:#fff; color:var(--ink); box-shadow:0 14px 34px -14px rgba(0,0,0,.4)}
.btn-white:hover{transform:translateY(-2px); box-shadow:0 20px 44px -14px rgba(0,0,0,.5)}
.btn-line{border-color:var(--line); background:#fff; color:var(--text)}
.btn-line:hover{border-color:var(--blue); color:var(--blue); transform:translateY(-2px)}
.b-ink .btn-line,.b-blue .btn-line{background:transparent; border-color:var(--line-dark); color:#fff}
.b-ink .btn-line:hover,.b-blue .btn-line:hover{border-color:#fff; color:#fff; background:rgba(255,255,255,.08)}
.btn-lg{padding:1.08em 1.95em; font-size:1rem}
.btn-sm{padding:.66em 1.15em; font-size:.87rem}

/* ---------- nav ---------- */
.nav{position:sticky; top:env(safe-area-inset-top,0px); z-index:80; background:rgba(238,241,248,.86); backdrop-filter:blur(18px) saturate(160%); border-bottom:1px solid transparent; transition:border-color .25s, background .25s, box-shadow .25s}
.nav.stuck{border-bottom-color:var(--line); background:rgba(255,255,255,.9); box-shadow:0 1px 20px rgba(8,13,48,.06)}
.nav-in{display:flex; align-items:center; gap:1.1rem; height:78px}
.brand{display:flex; align-items:center; gap:.65rem; margin-right:auto; flex:none}
.mark{
  width:38px; height:38px; border-radius:11px; flex:none; display:grid; place-items:center;
  background:linear-gradient(140deg,var(--blue-hi),var(--blue) 52%,var(--blue-deep));
  box-shadow:0 8px 20px -6px rgba(35,64,255,.6);
  font-family:"Archivo",sans-serif; font-variation-settings:"wdth" 118; font-weight:900; font-size:17px; color:#fff; letter-spacing:-.05em;
}
.brand-name{font-family:"Archivo",sans-serif; font-variation-settings:"wdth" 105; font-weight:800; font-size:1.02rem; letter-spacing:-.035em; line-height:1.05; display:block; color:var(--ink)}
.brand-sub{display:block; font-family:"JetBrains Mono",monospace; font-size:.58rem; letter-spacing:.2em; text-transform:uppercase; color:var(--text-3); margin-top:3px}
.nav-links{display:flex; align-items:center; gap:.15rem}
.nav-links > a,.drop > button{
  font-size:.92rem; font-weight:600; color:var(--text-2); padding:.55rem .78rem; border-radius:999px;
  background:none; border:0; cursor:pointer; display:inline-flex; align-items:center; gap:.35em;
  transition:color .2s, background .2s;
}
.nav-links > a:hover,.drop > button:hover{color:var(--blue); background:var(--blue-tint)}
.nav-links > a.on{color:var(--blue); background:var(--blue-tint)}
.drop{position:relative}
.drop > button svg{transition:transform .25s var(--ease)}
.drop:hover > button svg,.drop:focus-within > button svg{transform:rotate(180deg)}
.drop-menu{
  position:absolute; top:calc(100% + 8px); left:0; min-width:270px; padding:.5rem;
  background:#fff; border:1px solid var(--line); border-radius:var(--r-m); box-shadow:var(--sh-m);
  opacity:0; visibility:hidden; transform:translateY(-6px); transition:all .22s var(--ease);
}
.drop:hover .drop-menu,.drop:focus-within .drop-menu{opacity:1; visibility:visible; transform:none}
.drop-menu a{display:block; padding:.6rem .75rem; border-radius:9px; font-size:.9rem; font-weight:600; color:var(--text); transition:background .18s, color .18s}
.drop-menu a span{display:block; font-weight:500; font-size:.78rem; color:var(--text-3); margin-top:2px}
.drop-menu a:hover{background:var(--blue-wash); color:var(--blue)}
.nav-phone{display:inline-flex; align-items:center; gap:.45em; font-weight:700; font-size:.92rem; color:var(--ink); padding:.55rem .6rem; white-space:nowrap}
.nav-phone:hover{color:var(--blue)}
.burger{display:none; width:44px; height:44px; border:1px solid var(--line); background:#fff; border-radius:12px; cursor:pointer; align-items:center; justify-content:center; flex-direction:column; gap:4px}
.burger i{display:block; width:17px; height:2px; background:var(--ink); border-radius:2px; transition:transform .25s var(--ease), opacity .2s}
.burger[aria-expanded="true"] i:nth-child(1){transform:translateY(6px) rotate(45deg)}
.burger[aria-expanded="true"] i:nth-child(2){opacity:0}
.burger[aria-expanded="true"] i:nth-child(3){transform:translateY(-6px) rotate(-45deg)}
@media (max-width:1230px){ .nav-phone{display:none} }
@media (max-width:1150px){
  .nav-links{display:none}
  .burger{display:flex}
}
@media (max-width:600px){
  .nav-in > .btn-orange{display:none}
  .nav-in{height:70px}
  .brand-name{font-size:.96rem}
}
.mobile{display:none; border-top:1px solid var(--line); background:#fff; padding:1rem var(--gut) 1.6rem}
.mobile.open{display:block}
.mobile a{display:block; padding:.78rem 0; border-bottom:1px solid var(--line-2); font-weight:700; font-size:1.02rem}
.mobile .sub{padding-left:1rem; font-weight:500; font-size:.94rem; color:var(--text-2)}
.mobile .btn{width:100%; margin-top:1.1rem}

/* ---------- hero ---------- */
.hero{position:relative; overflow:hidden; padding-top:clamp(40px,4.6vw,70px); padding-bottom:clamp(60px,7vw,104px)}
.hero::before{
  content:""; position:absolute; top:-34%; right:-16%; width:min(920px,86vw); aspect-ratio:1; border-radius:50%;
  background:radial-gradient(circle,rgba(35,64,255,.3),rgba(94,116,255,.12) 42%,transparent 66%);
  pointer-events:none;
}
.hero::after{
  content:""; position:absolute; bottom:-30%; left:-14%; width:min(660px,70vw); aspect-ratio:1; border-radius:50%;
  background:radial-gradient(circle,rgba(255,74,20,.16),transparent 62%); pointer-events:none;
}
.hero-grid{position:relative; display:grid; grid-template-columns:minmax(0,1.04fr) minmax(0,.96fr); gap:clamp(34px,4.6vw,62px); align-items:center}
@media (max-width:1000px){.hero-grid{grid-template-columns:1fr}}
.hero-copy{display:flex; flex-direction:column; align-items:flex-start; gap:1.5rem}
h1.hero-h1{font-size:var(--fs-hero); font-variation-settings:"wdth" 108; letter-spacing:-.038em; line-height:.98}
.hl{color:var(--blue); white-space:nowrap;
  background-image:linear-gradient(var(--orange),var(--orange));
  background-repeat:no-repeat; background-size:100% .1em; background-position:0 96%;
  padding-bottom:.06em;}
.hero-lede{font-size:clamp(1.06rem,1.4vw,1.25rem); color:var(--text-2); max-width:54ch; line-height:1.58}
.hero-cta{display:flex; flex-wrap:wrap; gap:.7rem}
.assure{display:flex; flex-wrap:wrap; gap:.5rem 1.4rem; font-size:.9rem; color:var(--text-2); font-weight:600}
.assure span{display:inline-flex; align-items:center; gap:.42em}
.tick{width:18px;height:18px;flex:none;color:var(--green)}

/* ---------- serp card ---------- */
.serp{background:#fff; border-radius:var(--r-l); box-shadow:var(--sh-l); overflow:hidden; border:1px solid rgba(255,255,255,.7)}
.serp-top{padding:1rem 1.1rem; border-bottom:1px solid var(--line-2); display:flex; align-items:center; gap:.6rem}
.serp-search{flex:1; display:flex; align-items:center; gap:.55rem; background:var(--porcelain); border-radius:999px; padding:.55rem .95rem; font-size:.88rem; color:var(--text-2)}
.serp-search svg{color:var(--text-3); flex:none}
.serp-label{padding:.85rem 1.1rem .2rem; font-family:"JetBrains Mono",monospace; font-size:.62rem; letter-spacing:.15em; text-transform:uppercase; color:var(--text-3); display:flex; align-items:center; justify-content:space-between; gap:.5rem}
.pack{padding:.35rem .6rem .7rem}
.pack-row{display:flex; align-items:center; gap:.8rem; padding:.7rem .55rem; border-radius:12px; position:relative; transition:background .3s}
.pack-row.you{background:linear-gradient(100deg,var(--blue-wash),rgba(240,242,255,.35)); box-shadow:inset 0 0 0 1.5px var(--blue-tint)}
.pin{width:30px; height:30px; border-radius:9px; flex:none; display:grid; place-items:center; font-family:"Archivo",sans-serif; font-weight:800; font-size:.82rem; color:#fff; background:var(--text-3)}
.pack-row.you .pin{background:var(--blue); box-shadow:0 6px 14px -4px rgba(35,64,255,.6)}
.pack-info{min-width:0; flex:1}
.pack-name{font-weight:700; font-size:.92rem; letter-spacing:-.01em; white-space:nowrap; overflow:hidden; text-overflow:ellipsis}
.pack-meta{font-size:.76rem; color:var(--text-3); display:flex; align-items:center; gap:.35em; margin-top:1px}
.stars{color:var(--gold); letter-spacing:-.5px; font-size:.8rem}
.you-badge{font-family:"JetBrains Mono",monospace; font-size:.58rem; letter-spacing:.11em; text-transform:uppercase; background:var(--blue); color:#fff; padding:.26em .6em; border-radius:999px; flex:none}
.serp-rows{border-top:1px solid var(--line-2)}
.rank-head,.rank-row{display:grid; grid-template-columns:minmax(0,1fr) 46px 46px 56px; align-items:center; gap:.45rem; padding:.55rem 1.1rem}
.rank-head{font-family:"JetBrains Mono",monospace; font-size:.58rem; letter-spacing:.14em; text-transform:uppercase; color:var(--text-3); padding-top:.85rem}
.rank-row{border-top:1px solid var(--line-2)}
.kw{font-size:.86rem; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; color:var(--text-2)}
.num{font-family:"JetBrains Mono",monospace; font-variant-numeric:tabular-nums; font-size:.88rem; text-align:right}
.num.was{color:var(--text-3)}
.num.now{color:var(--blue); font-weight:600}
.delta{font-family:"JetBrains Mono",monospace; font-size:.7rem; text-align:right; color:var(--green)}
.serp-foot{display:flex; gap:1rem; padding:.95rem 1.1rem; background:var(--ink); color:#fff}
.serp-foot > div{flex:1}
.serp-foot .big{font-family:"Archivo",sans-serif; font-weight:800; font-size:1.55rem; line-height:1; font-variant-numeric:tabular-nums; letter-spacing:-.03em}
.serp-foot .lbl{font-size:.68rem; color:var(--on-dark-3); font-family:"JetBrains Mono",monospace; letter-spacing:.1em; text-transform:uppercase; margin-top:.35rem}
@media (max-width:420px){
  .rank-head,.rank-row{grid-template-columns:minmax(0,1fr) 38px 38px 46px; padding-inline:.8rem}
  .kw{font-size:.79rem}
}

/* ---------- stats band ---------- */
.stats{display:grid; grid-template-columns:repeat(4,1fr)}
@media (max-width:820px){.stats{grid-template-columns:repeat(2,1fr)}}
.stat{padding:clamp(24px,3vw,40px) clamp(14px,2vw,28px); border-left:1px solid var(--line-dark)}
.stat:first-child{border-left:0; padding-left:0}
@media (max-width:820px){.stat:nth-child(odd){border-left:0; padding-left:0} .stat:nth-child(n+3){border-top:1px solid var(--line-dark)}}
.stat .v{font-family:"Archivo",sans-serif; font-variation-settings:"wdth" 108; font-weight:800; font-size:clamp(2.2rem,4vw,3.3rem); line-height:1; letter-spacing:-.04em; color:#fff; font-variant-numeric:tabular-nums}
.stat .v em{color:var(--orange-hi); font-style:normal}
.stat .k{margin-top:.7rem; font-size:.88rem; color:var(--on-dark-2); line-height:1.45; max-width:24ch}

/* ---------- CTR bars ---------- */
.ctr-grid{display:grid; grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr); gap:clamp(30px,4.6vw,66px); align-items:center}
@media (max-width:900px){.ctr-grid{grid-template-columns:1fr}}
.bars{display:flex; flex-direction:column; gap:.55rem}
.bar-row{display:grid; grid-template-columns:92px minmax(0,1fr) 56px; align-items:center; gap:.85rem}
.bar-lbl{font-family:"JetBrains Mono",monospace; font-size:.72rem; color:var(--text-2); text-align:right; font-weight:500}
.bar-track{display:block; height:30px; border-radius:7px; background:var(--porcelain-2); overflow:hidden}
.bar-fill{display:block; height:100%; width:0; border-radius:7px; background:linear-gradient(90deg,var(--blue-deep),var(--blue) 60%,var(--blue-hi)); transition:width 1.1s var(--ease)}
.bar-row.hot .bar-fill{background:linear-gradient(90deg,var(--orange),#ff7a45)}
.bar-row.cold .bar-fill{background:var(--text-3); opacity:.4}
.bar-row.cold .bar-lbl,.bar-row.cold .bar-val{color:var(--text-3)}
.bar-val{font-family:"JetBrains Mono",monospace; font-variant-numeric:tabular-nums; font-size:.82rem; color:var(--text); font-weight:500}
.src{margin-top:1.3rem; font-size:.74rem; color:var(--text-3); font-family:"JetBrains Mono",monospace}
.pullquote{font-family:"Archivo",sans-serif; font-variation-settings:"wdth" 104; font-weight:800; font-size:clamp(1.5rem,2.7vw,2.15rem); line-height:1.12; letter-spacing:-.03em}
.pullquote em{color:var(--blue); font-style:normal}

/* ---------- service cards ---------- */
.svc-grid{display:grid; grid-template-columns:repeat(2,1fr); gap:clamp(14px,1.6vw,20px)}
@media (max-width:860px){.svc-grid{grid-template-columns:1fr}}
.svc{
  background:#fff; border-radius:var(--r-l); padding:clamp(24px,2.7vw,36px);
  display:flex; flex-direction:column; gap:1.05rem; border:1px solid var(--line-2);
  box-shadow:var(--sh-s); position:relative; overflow:hidden;
  transition:transform .3s var(--ease), box-shadow .3s var(--ease), border-color .3s var(--ease);
}
.svc::after{content:""; position:absolute; left:0; top:0; bottom:0; width:4px; background:var(--blue); transform:scaleY(0); transform-origin:top; transition:transform .38s var(--ease)}
.svc:hover{transform:translateY(-4px); box-shadow:var(--sh-m); border-color:var(--blue-tint)}
.svc:hover::after{transform:scaleY(1)}
.svc.wide{grid-column:1/-1}
.svc-ico{width:48px; height:48px; border-radius:13px; display:grid; place-items:center; background:var(--blue-wash); color:var(--blue); flex:none}
.svc:hover .svc-ico{background:var(--blue); color:#fff}
.svc-ico{transition:background .3s, color .3s}
.svc h3{font-size:var(--fs-h3)}
.svc p{color:var(--text-2); font-size:.97rem}
.chips{display:flex; flex-wrap:wrap; gap:.4rem; margin-top:auto; padding-top:.3rem}
.chip{font-family:"JetBrains Mono",monospace; font-size:.68rem; padding:.36em .72em; border-radius:999px; background:var(--porcelain); color:var(--text-2); border:1px solid var(--line-2)}
.svc-more{display:inline-flex; align-items:center; gap:.4em; font-weight:700; font-size:.9rem; color:var(--blue)}
.svc-more svg{transition:transform .25s var(--ease)}
.svc:hover .svc-more svg{transform:translateX(4px)}

/* ---------- industries ---------- */
.ticker{overflow:hidden; padding-block:1.25rem; -webkit-mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent); mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent)}
.ticker-track{display:flex; gap:2.4rem; width:max-content; animation:slide 46s linear infinite; align-items:center}
.ticker-track span{font-family:"Archivo",sans-serif; font-variation-settings:"wdth" 106; font-weight:800; font-size:clamp(1.15rem,2vw,1.6rem); letter-spacing:-.03em; color:var(--on-dark-3); white-space:nowrap; display:inline-flex; align-items:center; gap:2.4rem}
.ticker-track span::after{content:""; width:7px; height:7px; border-radius:50%; background:var(--orange); flex:none}
@keyframes slide{to{transform:translateX(-50%)}}
.ind-grid{display:grid; grid-template-columns:repeat(4,1fr); gap:clamp(10px,1.2vw,14px)}
@media (max-width:900px){.ind-grid{grid-template-columns:repeat(2,1fr)}}
.ind{background:#fff; border:1px solid var(--line-2); border-radius:var(--r-m); padding:1.15rem 1.15rem 1.25rem; display:flex; flex-direction:column; gap:.4rem; transition:transform .25s var(--ease), border-color .25s, box-shadow .25s}
.ind:hover{transform:translateY(-3px); border-color:var(--blue-tint); box-shadow:var(--sh-m)}
.ind b{font-family:"Archivo",sans-serif; font-weight:800; font-size:1.02rem; letter-spacing:-.022em}
.ind small{font-size:.82rem; color:var(--text-3); line-height:1.45}

/* ---------- process ---------- */
.steps{display:grid; grid-template-columns:repeat(5,1fr); gap:clamp(12px,1.4vw,18px); counter-reset:s}
@media (max-width:1040px){.steps{grid-template-columns:repeat(2,1fr)}}
@media (max-width:560px){.steps{grid-template-columns:1fr}}
.step{background:#fff; border:1px solid var(--line-2); border-radius:var(--r-m); padding:clamp(20px,2.1vw,26px); display:flex; flex-direction:column; gap:.55rem; position:relative; transition:transform .25s var(--ease), box-shadow .25s}
.step:hover{transform:translateY(-4px); box-shadow:var(--sh-m)}
.step .n{font-family:"Archivo",sans-serif; font-variation-settings:"wdth" 112; font-weight:900; font-size:2.4rem; line-height:.85; letter-spacing:-.05em; color:var(--blue-tint); margin-bottom:.5rem}
.step:hover .n{color:var(--blue)} .step .n{transition:color .3s}
.step h3{font-size:1.06rem}
.step p{font-size:.89rem; color:var(--text-2); line-height:1.5}
.step .when{margin-top:auto; padding-top:.7rem; font-family:"JetBrains Mono",monospace; font-size:.66rem; letter-spacing:.09em; text-transform:uppercase; color:var(--orange); font-weight:500}

/* ---------- cases ---------- */
.cases{display:grid; grid-template-columns:repeat(3,1fr); gap:clamp(14px,1.6vw,20px)}
@media (max-width:920px){.cases{grid-template-columns:1fr}}
.case{background:#fff; border-radius:var(--r-l); padding:clamp(22px,2.4vw,30px); display:flex; flex-direction:column; gap:1rem; border:1px solid var(--line-2); box-shadow:var(--sh-s); transition:transform .28s var(--ease), box-shadow .28s}
.case:hover{transform:translateY(-5px); box-shadow:var(--sh-m)}
.case .who{font-family:"JetBrains Mono",monospace; font-size:.66rem; letter-spacing:.13em; text-transform:uppercase; color:var(--blue); font-weight:500}
.case h3{font-size:1.2rem; line-height:1.18}
.case p{font-size:.93rem; color:var(--text-2)}
.case .metrics{display:flex; gap:1.6rem; margin-top:auto; padding-top:1.1rem; border-top:1px solid var(--line-2)}
.case .metrics div{display:flex; flex-direction:column}
.case .metrics b{font-family:"Archivo",sans-serif; font-weight:800; font-size:1.7rem; line-height:1; letter-spacing:-.04em; color:var(--blue); font-variant-numeric:tabular-nums}
.case .metrics b.orange{color:var(--orange)}
.case .metrics small{font-size:.7rem; color:var(--text-3); margin-top:.4rem}

/* ---------- website-included callout ---------- */
.included{
  display:grid; grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr); gap:clamp(26px,3.6vw,54px); align-items:center;
  background:linear-gradient(120deg,var(--ink) 0%,var(--ink-2) 58%,var(--ink-3) 100%);
  border-radius:var(--r-xl); padding:clamp(28px,3.6vw,54px); color:var(--on-dark); position:relative; overflow:hidden;
  box-shadow:var(--sh-l);
}
.included::before{content:""; position:absolute; top:-40%; right:-8%; width:520px; aspect-ratio:1; border-radius:50%; background:radial-gradient(circle,rgba(35,64,255,.55),transparent 62%)}
.included::after{content:""; position:absolute; bottom:-46%; left:24%; width:420px; aspect-ratio:1; border-radius:50%; background:radial-gradient(circle,rgba(255,74,20,.34),transparent 64%)}
.included > *{position:relative; z-index:1}
@media (max-width:900px){.included{grid-template-columns:1fr}}
.included h2{font-size:clamp(1.7rem,3.2vw,2.5rem); color:#fff}
.included p{color:var(--on-dark-2); margin-top:.9rem; font-size:1.02rem; max-width:48ch}
.inc-list{display:grid; grid-template-columns:1fr 1fr; gap:.8rem 1.4rem; margin-top:1.7rem}
@media (max-width:520px){.inc-list{grid-template-columns:1fr}}
.inc-list div{display:flex; gap:.55rem; align-items:flex-start; font-size:.92rem; color:var(--on-dark); line-height:1.4}
.inc-list svg{flex:none; margin-top:.25em; color:var(--green)}
.inc-price{background:rgba(255,255,255,.09); border:1px solid rgba(255,255,255,.2); border-radius:var(--r-l); padding:clamp(28px,3.2vw,44px) clamp(22px,2.4vw,32px); backdrop-filter:blur(10px); text-align:center; display:flex; flex-direction:column; justify-content:center; gap:.2rem; box-shadow:0 30px 70px -30px rgba(0,0,0,.7)}
.inc-price .strike{font-size:1rem; color:var(--on-dark-3); text-decoration:line-through; text-decoration-color:var(--orange); text-decoration-thickness:2px}
.inc-price .free{font-family:"Archivo",sans-serif; font-variation-settings:"wdth" 110; font-weight:900; font-size:clamp(2.6rem,5vw,3.8rem); line-height:1; letter-spacing:-.045em; color:#fff; margin:.4rem 0 .2rem}
.inc-price .free em{font-style:normal; color:var(--orange-hi)}
.inc-price .note{font-size:.86rem; color:var(--on-dark-2); line-height:1.45}

/* ---------- pricing ---------- */
.tiers{display:grid; grid-template-columns:repeat(3,1fr); gap:clamp(14px,1.6vw,20px); align-items:stretch}
@media (max-width:960px){.tiers{grid-template-columns:1fr; max-width:520px; margin-inline:auto}}
.tier{background:rgba(255,255,255,.055); border:1px solid var(--line-dark); border-radius:var(--r-l); padding:clamp(24px,2.6vw,34px); display:flex; flex-direction:column; gap:1.2rem; color:var(--on-dark)}
.tier h3{color:#fff; font-size:1.35rem}
.tier .for{font-size:.86rem; color:var(--on-dark-3); margin-top:.3rem}
.tier.feature{background:#fff; color:var(--text); border-color:#fff; box-shadow:0 40px 90px -30px rgba(0,0,0,.6); position:relative; transform:translateY(-10px)}
@media (max-width:960px){.tier.feature{transform:none}}
.tier.feature h3{color:var(--text)} .tier.feature .for{color:var(--text-3)}
.tier-flag{position:absolute; top:-13px; left:50%; transform:translateX(-50%); background:var(--orange); color:#fff; font-family:"JetBrains Mono",monospace; font-size:.6rem; letter-spacing:.13em; text-transform:uppercase; padding:.4em .9em; border-radius:999px; font-weight:500; white-space:nowrap; box-shadow:var(--sh-orange)}
.price{display:flex; align-items:flex-end; gap:.35rem}
.price b{font-family:"Archivo",sans-serif; font-variation-settings:"wdth" 108; font-weight:800; font-size:clamp(2.2rem,3.4vw,2.9rem); line-height:1; letter-spacing:-.04em; color:#fff}
.tier.feature .price b{color:var(--blue)}
.price span{font-size:.85rem; color:var(--on-dark-3); padding-bottom:.35rem}
.tier.feature .price span{color:var(--text-3)}
.tier-site{display:flex; align-items:center; gap:.6rem; background:rgba(255,106,50,.2); border:1px solid rgba(255,138,90,.62); border-radius:12px; padding:.72rem .85rem; font-size:.86rem; font-weight:700; color:#fff; line-height:1.3}
.tier.feature .tier-site{background:var(--orange-wash); border-color:#ffc4ae; color:var(--orange)}
.tier-site svg{flex:none; color:#ff9b6e}
.tier.feature .tier-site svg{color:var(--orange)}
.tier ul{list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:.6rem; font-size:.93rem}
.tier li{display:flex; gap:.6rem; align-items:flex-start; line-height:1.45; color:var(--on-dark-2)}
.tier.feature li{color:var(--text-2)}
.tier li svg{flex:none; margin-top:.28em; color:var(--green)}
.tier .btn{width:100%; margin-top:auto}

/* ---------- FAQ ---------- */
.faq-grid{display:grid; grid-template-columns:minmax(0,.6fr) minmax(0,1.4fr); gap:clamp(28px,4vw,60px); align-items:start}
@media (max-width:880px){.faq-grid{grid-template-columns:1fr}}
details{border-bottom:1px solid var(--line); background:transparent}
details summary{
  cursor:pointer; list-style:none; padding-block:1.2rem; display:flex; gap:1rem; align-items:flex-start;
  font-family:"Archivo",sans-serif; font-weight:800; font-size:1.06rem; letter-spacing:-.025em; line-height:1.3; transition:color .2s;
}
details summary::-webkit-details-marker{display:none}
details summary:hover{color:var(--blue)}
.plus{margin-left:auto; flex:none; width:22px; height:22px; border-radius:50%; background:var(--blue-wash); position:relative; margin-top:.15em; transition:background .25s}
details[open] .plus{background:var(--blue)}
.plus::before,.plus::after{content:""; position:absolute; background:var(--blue); border-radius:2px; transition:transform .3s var(--ease), background .25s}
.plus::before{left:6px; right:6px; top:10px; height:2px}
.plus::after{top:6px; bottom:6px; left:10px; width:2px}
details[open] .plus::before,details[open] .plus::after{background:#fff}
details[open] .plus::after{transform:rotate(90deg)}
details .ans{padding-bottom:1.35rem; color:var(--text-2); font-size:.96rem; max-width:66ch}

/* ---------- CTA + form ---------- */
.cta-band{background:linear-gradient(135deg,var(--blue-deep) 0%,var(--blue) 46%,#4459ff 100%); color:#fff; position:relative; overflow:hidden}
.cta-band::before{content:""; position:absolute; top:-45%; left:-10%; width:760px; aspect-ratio:1; border-radius:50%; background:radial-gradient(circle,rgba(255,255,255,.16),transparent 62%)}
.cta-band::after{content:""; position:absolute; bottom:-52%; right:-6%; width:640px; aspect-ratio:1; border-radius:50%; background:radial-gradient(circle,rgba(255,74,20,.4),transparent 64%)}
.cta-grid{position:relative; display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:clamp(30px,4.4vw,62px); align-items:center}
@media (max-width:920px){.cta-grid{grid-template-columns:1fr}}
.cta-grid h2{color:#fff; font-size:var(--fs-h2)}
.cta-grid .lede{color:rgba(255,255,255,.86)}
.cta-contact{display:flex; flex-wrap:wrap; gap:.7rem; margin-top:1.4rem}
.cta-contact a{display:inline-flex; align-items:center; gap:.5em; background:rgba(255,255,255,.14); border:1px solid rgba(255,255,255,.28); border-radius:999px; padding:.62em 1.1em; font-weight:700; font-size:.92rem; transition:background .22s, transform .22s}
.cta-contact a:hover{background:rgba(255,255,255,.26); transform:translateY(-2px)}
form.audit{display:grid; grid-template-columns:1fr 1fr; gap:.75rem; background:#fff; border-radius:var(--r-xl); padding:clamp(22px,2.6vw,34px); box-shadow:0 50px 100px -34px rgba(0,0,0,.5); color:var(--text)}
form.audit .full{grid-column:1/-1}
@media (max-width:520px){form.audit{grid-template-columns:1fr}}
.form-h{grid-column:1/-1; margin-bottom:.2rem}
.form-h b{font-family:"Archivo",sans-serif; font-weight:800; font-size:1.3rem; letter-spacing:-.028em; display:block}
.form-h span{font-size:.88rem; color:var(--text-3)}
.fld{display:flex; flex-direction:column; gap:.32rem}
.fld label{font-family:"JetBrains Mono",monospace; font-size:.62rem; letter-spacing:.13em; text-transform:uppercase; color:var(--text-3)}
.fld input,.fld select{background:var(--porcelain); border:1.5px solid transparent; border-radius:10px; padding:.76em .9em; font-size:.94rem; transition:border-color .2s, background .2s}
.fld input::placeholder{color:#a2a9c4}
.fld input:focus,.fld select:focus{border-color:var(--blue); background:#fff; outline:none}
.form-note{grid-column:1/-1; font-size:.76rem; color:var(--text-3); text-align:center; line-height:1.45}
.form-done{grid-column:1/-1; text-align:center; padding:2rem 1rem; color:var(--text)}
.form-done b{font-family:"Archivo",sans-serif; font-weight:800; font-size:1.3rem; display:block; margin-bottom:.5rem; letter-spacing:-.028em}
.form-done p{color:var(--text-2); font-size:.95rem}

/* ---------- page hero (inner pages) ---------- */
.phero{background:linear-gradient(160deg,var(--ink) 0%,var(--ink-2) 70%,var(--ink-3) 100%); color:var(--on-dark); position:relative; overflow:hidden; padding-block:clamp(56px,6.6vw,104px)}
.phero::before{content:""; position:absolute; top:-50%; right:-6%; width:720px; aspect-ratio:1; border-radius:50%; background:radial-gradient(circle,rgba(35,64,255,.6),transparent 63%)}
.phero::after{content:""; position:absolute; bottom:-60%; left:6%; width:520px; aspect-ratio:1; border-radius:50%; background:radial-gradient(circle,rgba(255,74,20,.3),transparent 64%)}
.phero .wrap{position:relative; z-index:1}
.phero h1{font-size:var(--fs-h1); color:#fff; margin-block:1rem .9rem}
.phero .lede{color:var(--on-dark-2); font-size:var(--fs-lede)}
.crumb{font-family:"JetBrains Mono",monospace; font-size:.68rem; letter-spacing:.11em; text-transform:uppercase; color:var(--on-dark-3); display:flex; gap:.55em; flex-wrap:wrap}
.crumb a:hover{color:#fff}
.phero-cta{display:flex; flex-wrap:wrap; gap:.7rem; margin-top:1.8rem}

/* ---------- prose / detail blocks ---------- */
.two{display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:clamp(26px,4vw,60px); align-items:start}
@media (max-width:880px){.two{grid-template-columns:1fr}}
.prose{display:flex; flex-direction:column; gap:1.1rem; max-width:64ch}
.prose h2{font-size:clamp(1.5rem,2.6vw,2rem); margin-top:.8rem}
.prose h3{font-size:1.18rem; margin-top:.6rem}
.prose p{color:var(--text-2)}
.prose ul{margin:0; padding-left:0; list-style:none; display:flex; flex-direction:column; gap:.62rem}
.prose li{display:flex; gap:.65rem; align-items:flex-start; color:var(--text-2); line-height:1.5}
.prose li svg{flex:none; margin-top:.3em; color:var(--blue)}
.panelcard{background:#fff; border:1px solid var(--line-2); border-radius:var(--r-l); padding:clamp(22px,2.5vw,32px); box-shadow:var(--sh-s); display:flex; flex-direction:column; gap:1rem}
.panelcard.sticky{position:sticky; top:104px}
.panelcard h3{font-size:1.2rem}
.panelcard p{font-size:.94rem; color:var(--text-2)}
.deliver{display:grid; grid-template-columns:repeat(3,1fr); gap:clamp(12px,1.4vw,18px)}
@media (max-width:860px){.deliver{grid-template-columns:1fr}}
.deliver .d{background:#fff; border:1px solid var(--line-2); border-radius:var(--r-m); padding:clamp(18px,2vw,26px); display:flex; flex-direction:column; gap:.5rem}
.deliver .d b{font-family:"Archivo",sans-serif; font-weight:800; font-size:1.02rem; letter-spacing:-.022em}
.deliver .d p{font-size:.89rem; color:var(--text-2); line-height:1.5}
.deliver .d .t{font-family:"JetBrains Mono",monospace; font-size:.64rem; letter-spacing:.13em; text-transform:uppercase; color:var(--orange); font-weight:500}

/* ---------- footer ---------- */
footer{background:var(--ink); color:var(--on-dark-2)}
.foot-grid{display:grid; grid-template-columns:1.7fr 1fr 1fr 1.25fr; gap:clamp(24px,3vw,42px); padding-block:clamp(48px,5.4vw,72px)}
@media (max-width:900px){.foot-grid{grid-template-columns:1fr 1fr}}
@media (max-width:520px){.foot-grid{grid-template-columns:1fr}}
footer .brand-name{color:#fff}
footer h4{font-family:"JetBrains Mono",monospace; font-size:.64rem; letter-spacing:.16em; text-transform:uppercase; color:var(--on-dark-3); font-weight:400; margin:0 0 1rem}
footer ul{list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:.58rem; font-size:.9rem}
footer a:hover{color:#fff}
footer p{font-size:.92rem; max-width:40ch; line-height:1.6}
.foot-cta{display:inline-flex; align-items:center; gap:.5em; margin-top:1rem; font-weight:700; color:#fff; font-size:1.05rem}
.foot-cta:hover{color:var(--orange-hi)}
.legal{border-top:1px solid var(--line-dark); padding-block:1.4rem; display:flex; flex-wrap:wrap; gap:.6rem 1.5rem; align-items:center; font-size:.79rem; color:var(--on-dark-3)}
.legal .sp{margin-left:auto}

/* ---------- reveal ---------- */
.will-reveal{opacity:.001; transform:translateY(18px)}
.revealed{opacity:1; transform:none; transition:opacity .65s var(--ease), transform .65s var(--ease)}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.001ms !important; animation-iteration-count:1 !important; transition-duration:.001ms !important}
  .will-reveal{opacity:1; transform:none}
  .ticker-track{animation:none}
}

/* ---------- skip link ---------- */
.skip{position:absolute; left:-9999px; top:0; z-index:200; background:var(--ink); color:#fff;
  padding:.8rem 1.2rem; border-radius:0 0 10px 0; font-weight:700; font-size:.9rem}
.skip:focus{left:0}

/* ---------- related links ---------- */
.rel-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:clamp(12px,1.4vw,18px)}
@media (max-width:860px){.rel-grid{grid-template-columns:1fr}}
.rel{background:#fff; border:1px solid var(--line-2); border-radius:var(--r-m); padding:clamp(18px,2vw,26px);
  display:flex; flex-direction:column; gap:.45rem; transition:transform .25s var(--ease), box-shadow .25s, border-color .25s}
.b-porcelain .rel{background:#fff}
.rel:hover{transform:translateY(-4px); box-shadow:var(--sh-m); border-color:var(--blue-tint)}
.rel b{font-family:"Archivo",sans-serif; font-weight:800; font-size:1.06rem; letter-spacing:-.024em; color:var(--text)}
.rel span{font-size:.89rem; color:var(--text-2); line-height:1.5}
.rel em{font-style:normal; font-weight:700; font-size:.84rem; color:var(--blue); display:inline-flex; align-items:center; gap:.35em; margin-top:.35rem}
.rel:hover em svg{transform:translateX(4px)} .rel em svg{transition:transform .25s var(--ease)}

/* ---------- city strip ---------- */
.city-strip{display:flex; flex-wrap:wrap; gap:.55rem}
.city-strip a{display:inline-flex; align-items:center; gap:.4em; background:#fff; border:1px solid var(--line);
  border-radius:999px; padding:.6em 1.1em; font-weight:600; font-size:.92rem; color:var(--text-2);
  transition:border-color .22s, color .22s, transform .22s, background .22s}
.city-strip a:hover{border-color:var(--blue); color:var(--blue); background:var(--blue-wash); transform:translateY(-2px)}
.city-strip a.on{background:var(--blue); border-color:var(--blue); color:#fff}

/* ---------- definition / brand block ---------- */
.define{background:#fff; border:1px solid var(--line-2); border-left:5px solid var(--blue);
  border-radius:0 var(--r-m) var(--r-m) 0; padding:clamp(22px,2.6vw,34px); box-shadow:var(--sh-s)}
.define h2{font-size:clamp(1.4rem,2.4vw,1.85rem); margin-bottom:.9rem}
.define p{color:var(--text-2); font-size:1.02rem}
.define p + p{margin-top:.9rem}
.define strong{color:var(--text); font-weight:700}

/* ---------- 404 ---------- */
.nf{min-height:52vh; display:flex; flex-direction:column; align-items:center; justify-content:center; text-align:center; gap:1.1rem}
.nf .code{font-family:"Archivo",sans-serif; font-variation-settings:"wdth" 115; font-weight:900;
  font-size:clamp(4rem,14vw,9rem); line-height:.85; letter-spacing:-.05em; color:var(--blue-tint)}

/* ---------- lists inside side panels ---------- */
.panelcard ul{list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:.62rem}
.panelcard li{display:flex; gap:.65rem; align-items:flex-start; color:var(--text-2); line-height:1.5; font-size:.94rem}
.panelcard li svg{flex:none; margin-top:.3em; color:var(--blue)}
.panelcard li b{color:var(--text); font-weight:700}
.define ul{list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:.62rem}
.define li{display:flex; gap:.65rem; align-items:flex-start; color:var(--text-2); line-height:1.5}
.define li svg{flex:none; margin-top:.3em; color:var(--blue)}
.rel em{margin-top:auto}

/* ---------- keyword table ---------- */
.kwbox{background:#fff; border:1px solid var(--line-2); border-radius:var(--r-l); overflow:hidden; box-shadow:var(--sh-s)}
.kwhead,.kwrow{display:grid; grid-template-columns:minmax(0,.9fr) minmax(0,1.5fr); gap:1.4rem; padding:1rem clamp(18px,2vw,26px)}
.kwhead{font-family:"JetBrains Mono",monospace; font-size:.62rem; letter-spacing:.14em; text-transform:uppercase;
  color:var(--text-3); background:var(--porcelain); border-bottom:1px solid var(--line-2)}
.kwrow{border-bottom:1px solid var(--line-2); transition:background .2s}
.kwrow:last-child{border-bottom:0}
.kwrow:hover{background:var(--blue-wash)}
.kwrow b{font-family:"JetBrains Mono",monospace; font-weight:500; font-size:.88rem; color:var(--blue); line-height:1.4; word-break:break-word}
.kwrow span{font-size:.92rem; color:var(--text-2); line-height:1.5}
@media (max-width:680px){
  .kwhead{display:none}
  .kwrow{grid-template-columns:1fr; gap:.35rem; padding-block:.95rem}
}
a.ind{text-decoration:none}
a.ind b{color:var(--text)} a.ind:hover b{color:var(--blue)}

/* ---------- blog ---------- */
.postmeta{font-family:"JetBrains Mono",monospace; font-size:.72rem; letter-spacing:.1em; text-transform:uppercase; color:var(--on-dark-3)}
.article{display:grid; grid-template-columns:minmax(0,1fr) minmax(0,.4fr); gap:clamp(30px,4vw,64px); align-items:start}
@media (max-width:920px){.article{grid-template-columns:1fr} .postside{order:-1}}
.post{max-width:70ch}
.post h2{font-size:clamp(1.4rem,2.5vw,1.95rem); margin-top:2.4rem; margin-bottom:.9rem; scroll-margin-top:100px}
.post h2:first-of-type{margin-top:1.6rem}
.post p{color:var(--text-2); margin-bottom:1rem; line-height:1.72}
.post ul,.post ol{margin:0 0 1.2rem; padding-left:1.3rem; display:flex; flex-direction:column; gap:.6rem}
.post li{color:var(--text-2); line-height:1.6}
.post li::marker{color:var(--blue)}
.post b{color:var(--text); font-weight:700}
.post a{color:var(--blue); font-weight:600; text-decoration:underline; text-underline-offset:2px; text-decoration-thickness:1.5px}
.post a:hover{color:var(--orange)}
.answerbox{background:var(--blue-wash); border:1px solid var(--blue-tint); border-left:5px solid var(--blue);
  border-radius:0 var(--r-m) var(--r-m) 0; padding:clamp(18px,2.2vw,26px); margin-bottom:1.4rem}
.answerbox .albl{font-family:"JetBrains Mono",monospace; font-size:.62rem; letter-spacing:.15em;
  text-transform:uppercase; color:var(--blue); display:block; margin-bottom:.55rem; font-weight:500}
.answerbox p{margin:0; color:var(--text); font-size:1.04rem; line-height:1.6; font-weight:500}
.toc{list-style:none; counter-reset:t; margin:0; padding:0; display:flex; flex-direction:column; gap:.5rem}
.toc li{counter-increment:t; display:flex; gap:.6rem; font-size:.9rem; line-height:1.4}
.toc li::before{content:counter(t,decimal-leading-zero); font-family:"JetBrains Mono",monospace;
  font-size:.72rem; color:var(--blue); flex:none; padding-top:.15em}
.toc a{color:var(--text-2)} .toc a:hover{color:var(--blue)}
.postgrid{display:grid; grid-template-columns:repeat(3,1fr); gap:clamp(14px,1.6vw,20px)}
@media (max-width:980px){.postgrid{grid-template-columns:repeat(2,1fr)}}
@media (max-width:640px){.postgrid{grid-template-columns:1fr}}
.postcard{background:#fff; border:1px solid var(--line-2); border-radius:var(--r-l); padding:clamp(20px,2.2vw,28px);
  display:flex; flex-direction:column; gap:.6rem; box-shadow:var(--sh-s);
  transition:transform .26s var(--ease), box-shadow .26s, border-color .26s}
.postcard:hover{transform:translateY(-5px); box-shadow:var(--sh-m); border-color:var(--blue-tint)}
.pdate{font-family:"JetBrains Mono",monospace; font-size:.64rem; letter-spacing:.11em; text-transform:uppercase; color:var(--text-3)}
.postcard b{font-family:"Archivo",sans-serif; font-weight:800; font-size:1.14rem; letter-spacing:-.026em; line-height:1.22; color:var(--text)}
.postcard:hover b{color:var(--blue)}
.pdesc{font-size:.9rem; color:var(--text-2); line-height:1.55}
.postcard em{font-style:normal; font-weight:700; font-size:.84rem; color:var(--blue);
  display:inline-flex; align-items:center; gap:.35em; margin-top:auto; padding-top:.5rem}
.postcard:hover em svg{transform:translateX(4px)} .postcard em svg{transition:transform .25s var(--ease)}