/* The home page only: the morning paper (hero), rank ribbons, key rings, the podium and the
   carbon copy. Prefix hm-. Sample data everywhere; the page reads fine without p-home.js. */

/* hero */
.hm-hero{position:relative;padding:4rem 0 5rem;background:var(--sk-ink);overflow:hidden;border-bottom:1px solid #1d2935}
.hm-hero::before{content:'';position:absolute;inset:0;pointer-events:none;background:repeating-linear-gradient(180deg,rgba(255,255,255,.018) 0 1px,transparent 1px 4px)}
.hm-hero .wrap{position:relative}
.hm-hero-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.02fr);gap:3.5rem;align-items:start}
.hm-hero .h1{font-size:clamp(2.4rem,4.6vw,4.3rem);margin-bottom:1.4rem}
.hm-hero .h1 em{display:block}
.hm-hero .lede{font-size:1.1rem}

/* the paper */
.hm-np{margin:0}
.hm-np-bar{display:flex;align-items:center;justify-content:space-between;gap:.6rem;margin:0 0 .6rem;font:500 .66rem var(--sk-mono);color:var(--sk-text-3);text-transform:uppercase;letter-spacing:.06em}
.hm-np-btn{padding:.2rem .55rem;border:1px solid var(--sk-line-2);border-radius:6px;background:var(--sk-ink-2);color:var(--sk-text-2);font:600 .62rem var(--sk-mono);cursor:pointer}
.hm-paper{position:relative;overflow:hidden;padding:1rem 1.15rem .9rem;border-radius:3px;background:#f4f0e6;color:#17212b;box-shadow:12px 12px 0 #0a0f14,0 0 0 1px #d6ccb9;background-image:radial-gradient(rgba(23,33,43,.05) 1px,transparent 1px);background-size:4px 4px}
.hm-roller{position:absolute;left:-2%;right:-2%;top:-16px;z-index:2;height:12px;border-radius:6px;background:linear-gradient(180deg,#5a6b7c,#17212b 55%,#0a0f14);box-shadow:0 6px 10px -4px rgba(10,15,20,.55);opacity:0;pointer-events:none;transition:top .6s cubic-bezier(.3,.7,.3,1),opacity .3s}
.hm-np.hm-run .hm-roller{opacity:1}
.hm-mast{text-align:center;padding-bottom:.45rem;margin-bottom:.75rem;border-bottom:3px double #17212b}
.hm-mast-top{display:flex;justify-content:space-between;gap:.5rem;margin:0;padding-bottom:.3rem;border-bottom:1px solid #17212b;font:500 .56rem var(--sk-mono);letter-spacing:.06em;text-transform:uppercase}
.hm-mast-name{margin:.3rem 0 .05rem;font:400 clamp(2rem,3.6vw,2.9rem)/1 var(--sk-serif);letter-spacing:-.01em}
.hm-mast-sub{margin:0;font:500 .58rem var(--sk-mono);color:#4a5866}
.hm-kick{margin:0 0 .2rem;font:600 .56rem var(--sk-mono);letter-spacing:.08em;text-transform:uppercase;color:#a8401a}
.hm-hl{margin:0 0 .35rem;font:800 clamp(1.25rem,2.1vw,1.7rem)/1.08 var(--sk-disp);letter-spacing:-.02em;text-wrap:balance}
.hm-h{margin:0 0 .2rem;font:700 .98rem/1.15 var(--sk-disp);letter-spacing:-.01em}
.hm-tx{margin:0;font-size:.8rem;line-height:1.45;color:#33414e}
.hm-tx code{font-size:.92em;color:#17212b}
.hm-cols{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.75rem 1.1rem;margin-top:.75rem;padding-top:.75rem;border-top:1px solid #c9bfa9}
.hm-cols .hm-st:nth-child(odd){padding-right:1.1rem;border-right:1px solid #d6ccb9}
.hm-wx{margin-top:.75rem;padding:.5rem .7rem;border:1px solid #17212b;background:#ebe4d3}
.hm-wx .hm-kick{color:#8a5a00}
.hm-foot{display:flex;flex-wrap:wrap;justify-content:space-between;gap:.25rem .8rem;margin-top:.75rem;padding-top:.45rem;border-top:3px double #17212b;font:500 .62rem var(--sk-mono)}
.hm-foot p{margin:0}
.hm-tick{color:#13805a;font-weight:800}
.hm-press{color:#a8401a}
.hm-on-hosted,.hm-np[data-state="hosted"] .hm-on-self{display:none}
.hm-np[data-state="hosted"] .hm-on-hosted{display:inline}
.hm-st{transition:opacity .5s,filter .5s}
.hm-np.hm-run .hm-st{opacity:.12;filter:blur(1.5px)}
.hm-np.hm-run .hm-st.on{opacity:1;filter:none}
.hm-np-ctl{margin:1.1rem 0 0}
.hm-np .cap{margin-top:.4rem}

/* 01 rank ribbons */
.hm-rk{position:relative;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:4.5rem}
.hm-rk-svg{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;overflow:visible}
.hm-rk-svg path{fill:none;stroke-width:3;opacity:.5;stroke-linecap:round}
.hm-rk-col{position:relative;z-index:1;min-width:0}
.hm-rk-h{margin:0;min-height:3.4rem}
.hm-rk-h b{display:block;font:700 1.15rem var(--sk-disp);color:#ffffff}
.hm-rk-h small{font:500 .66rem var(--sk-mono);color:var(--sk-text-3)}
.hm-rk ol{display:grid;gap:.5rem;margin:.8rem 0 0;padding:0;list-style:none}
.hm-rk li{position:relative;display:flex;align-items:center;justify-content:space-between;gap:.5rem;height:2.5rem;padding:0 .75rem;overflow:hidden;border-radius:6px;border:1px solid #2b3a48;border-left:5px solid var(--c,#5d6e7e);background:#0f161d;font:500 .8rem var(--sk-mono);color:#dce4eb;transition:border-color .4s}
.hm-rk li::after{content:'';position:absolute;left:0;bottom:0;height:3px;width:var(--w,0%);background:var(--c,#5d6e7e);opacity:.8;transition:width .6s cubic-bezier(.2,.8,.2,1)}
.hm-rk li span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.hm-rk li b{flex:none;color:#ffffff}

/* 02 key rings */
.hm-kr-pick{display:flex;flex-wrap:wrap;gap:.4rem;margin:1.6rem 0 0}
.hm-kr-pick button{position:relative;overflow:hidden;max-width:100%;padding:.45rem .7rem;border:1px solid #33475a;border-radius:999px;background:#121b24;color:var(--sk-text-2);cursor:pointer;text-align:left}
.hm-kr-pick button code{font-size:.7rem;overflow-wrap:anywhere}
.hm-kr-pick button:hover{border-color:#5d6e7e;color:#ffffff}
.hm-kr-pick [aria-checked="true"]{background:var(--sk-text);border-color:var(--sk-text);color:var(--sk-ink)}
.hm-kr{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1.6rem .9rem;padding-top:.9rem}
.hm-kr-ring,.hm-kr-tray{position:relative;padding:1.55rem .7rem .8rem;border-radius:14px;background:#121b24;border:1px solid #2b3a48;transition:border-color .35s,box-shadow .35s,transform .35s}
.hm-kr-ring::before{content:'';position:absolute;top:-.9rem;left:50%;width:1.9rem;height:1.9rem;margin-left:-.95rem;border:4px solid #5d6e7e;border-radius:50%;transition:border-color .35s}
.hm-kr-tray{border-style:dashed;background:transparent}
.hm-kr-name{margin:0 0 .55rem;text-align:center;font:700 .95rem/1.15 var(--sk-disp);color:#ffffff}
.hm-kr-other .hm-kr-name,.hm-kr-tray .hm-kr-name{font-size:.8rem}
.hm-kr ul{display:flex;flex-wrap:wrap;justify-content:center;gap:.3rem;margin:0;padding:0;list-style:none}
.hm-kr li{position:relative;padding:.2rem .45rem .2rem .7rem;border:1px solid #33475a;border-radius:3px 10px 10px 3px;background:#1d2935;color:#c3ced8;font:500 .62rem var(--sk-mono);transition:background .35s,color .35s,border-color .35s}
.hm-kr li::before{content:'';position:absolute;left:.25rem;top:50%;width:.22rem;height:.22rem;margin-top:-.11rem;border-radius:50%;background:#0f161d}
.hm-kr[data-state="tco"] [data-r="x"],.hm-kr[data-state="app"] [data-r="linkedin"],.hm-kr[data-state="utm"] [data-r="linkedin"],
.hm-kr[data-state="lfb"] [data-r="facebook"],.hm-kr[data-state="clid"] [data-r="facebook"],.hm-kr[data-state="pin"] [data-r="pinterest"],
.hm-kr[data-state="two"] [data-r="other"],.hm-kr[data-state="ph"] [data-r="none"]{border-color:var(--sk-ai);box-shadow:0 0 0 1px var(--sk-ai),0 14px 30px -16px rgba(235,104,52,.6);transform:translateY(-3px)}
.hm-kr[data-state="tco"] [data-r="x"]::before,.hm-kr[data-state="app"] [data-r="linkedin"]::before,.hm-kr[data-state="utm"] [data-r="linkedin"]::before,
.hm-kr[data-state="lfb"] [data-r="facebook"]::before,.hm-kr[data-state="clid"] [data-r="facebook"]::before,.hm-kr[data-state="pin"] [data-r="pinterest"]::before,
.hm-kr[data-state="two"] [data-r="other"]::before{border-color:var(--sk-ai)}
.hm-kr[data-state="tco"] [data-k="tco"],.hm-kr[data-state="app"] [data-k="app"],.hm-kr[data-state="utm"] [data-k="utm"],.hm-kr[data-state="lfb"] [data-k="lfb"],
.hm-kr[data-state="clid"] [data-k="clid"],.hm-kr[data-state="pin"] [data-k="pin"],.hm-kr[data-state="two"] [data-k="two"],.hm-kr[data-state="ph"] [data-k="ph"]{background:var(--sk-cta);border-color:var(--sk-ai);color:#ffffff;animation:hm-key .7s cubic-bezier(.2,.9,.3,1.3)}
@keyframes hm-key{0%{transform:translateY(-1.6rem) rotate(-14deg);opacity:0}100%{transform:none;opacity:1}}
.hm-kr-why{margin:1.2rem 0 0;min-height:3.2em;font:600 1.02rem/1.5 var(--sk-sans);color:#ffffff}

/* 03 podium (paper fold) */
.hm-pd{padding:1.4rem 1.4rem 1.2rem;border:1px solid var(--sk-paper-line);border-radius:8px;background:#ffffff;box-shadow:10px 10px 0 #17212b}
.hm-pd-unit{margin:0 0 .8rem;font:600 .72rem var(--sk-mono);letter-spacing:.06em;text-transform:uppercase;color:#4a5866}
.hm-pd-stage{display:flex;align-items:flex-end;gap:.9rem;height:17rem;margin:0;padding:0;list-style:none;border-bottom:3px solid #17212b}
.hm-pd-stage li{position:relative;display:flex;flex:1 1 0;flex-direction:column;justify-content:flex-end;align-items:stretch;height:100%;min-width:0}
.hm-pd-v{display:block;margin-bottom:.3rem;text-align:center;font:800 1.15rem var(--sk-disp);color:#17212b}
.hm-pd-v b{display:none;font-weight:800}
.hm-pd-b{display:block;min-height:3px;border-radius:5px 5px 0 0;background:var(--pc,#5d6e7e);transition:height .7s cubic-bezier(.2,.8,.2,1)}
.hm-pd-n{position:absolute;left:0;right:0;top:calc(100% + .35rem);text-align:center;font:600 .78rem/1.15 var(--sk-sans);color:#17212b;overflow-wrap:anywhere}
.hm-pd-n small{display:block;font:500 .6rem var(--sk-mono);color:#4a5866}
[data-s="google"]{--pc:#1baf7a}[data-s="direct"]{--pc:#8193a5}[data-s="chatgpt"]{--pc:#eb6834}[data-s="linkedin"]{--pc:#2a78d6}[data-s="news"]{--pc:#e87ba4}
.hm-pd[data-state="leads"] li{order:var(--rl)}.hm-pd[data-state="usd"] li{order:var(--ru)}.hm-pd[data-state="eur"] li{order:var(--re)}
.hm-pd[data-state="leads"] .hm-pd-b{height:calc(var(--leads) * 82% / 18)}
.hm-pd[data-state="usd"] .hm-pd-b{height:calc(var(--usd) * 82% / 2970)}
.hm-pd[data-state="eur"] .hm-pd-b{height:calc(var(--eur) * 82% / 590)}
.hm-pd[data-state="leads"] .v-l,.hm-pd[data-state="usd"] .v-u,.hm-pd[data-state="eur"] .v-e{display:inline}
.hm-pd-say{margin:3.6rem 0 0;color:#33414e;line-height:1.55}
.hm-pd-say strong{color:#17212b}

/* 04 carbon copy */
.hm-cc{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1rem;perspective:900px}
.hm-cc-sheet{position:relative;padding:1rem 1.1rem 1.1rem;border-radius:4px}
.hm-cc-top{background:#f4f0e6;color:#17212b;box-shadow:8px 8px 0 #0a0f14;transform-origin:50% 0;z-index:2}
.hm-cc-carbon{background:#1a2a44;color:#a9c6ff;border:1px solid #2f4a75;background-image:repeating-linear-gradient(115deg,rgba(255,255,255,.03) 0 2px,transparent 2px 7px)}
.hm-cc.lift .hm-cc-top{animation:hm-lift .9s cubic-bezier(.3,.7,.3,1)}
@keyframes hm-lift{0%{transform:none}35%{transform:translate(1.2rem,-.6rem) rotateX(26deg) rotate(2deg)}100%{transform:none}}
.hm-cc-t{margin:0 0 .7rem;font:700 1rem var(--sk-disp)}
.hm-cc-t small{display:block;font:500 .62rem var(--sk-mono);opacity:.75}
.hm-cc dl{margin:0;display:grid;gap:.1rem}
.hm-cc dl div{display:flex;justify-content:space-between;gap:.6rem;padding:.4rem .3rem;border-bottom:1px dotted currentColor;border-bottom-color:rgba(127,140,155,.45)}
.hm-cc dt{font-size:.82rem}
.hm-cc dd{margin:0;font:700 .88rem var(--sk-mono);text-align:right}
.hm-cc-carbon dd{filter:blur(.25px);text-shadow:0 0 1px rgba(169,198,255,.6)}
.hm-cc[data-state="wed"] .r1 dd{outline:2px solid #e0533f;outline-offset:2px;border-radius:50%;padding:0 .3rem}
.hm-cc[data-state="thu"] .r5 dd{font:500 .7rem var(--sk-mono);opacity:.7}
.hm-cc-stamp{position:absolute;right:.7rem;top:.7rem;transform:rotate(-8deg);font:800 .72rem var(--sk-mono);letter-spacing:.1em;text-transform:uppercase}
.hm-cc-stamp span{padding:.2rem .45rem;border:2px solid;border-radius:3px}
.s-ok{color:#13805a}.s-no{display:none;color:#c0392b}
.hm-cc[data-state="wed"] .s-ok{display:none}.hm-cc[data-state="wed"] .s-no{display:inline}
.hm-cc-say{margin:1.2rem 0 0;min-height:3em;font-weight:600;color:#ffffff;line-height:1.5}

@media (max-width:1000px){.hm-hero-grid{grid-template-columns:minmax(0,1fr)}}
@media (max-width:760px){
  .hm-rk{grid-template-columns:minmax(0,1fr);gap:1.6rem}.hm-rk-svg{display:none}.hm-rk-h{min-height:0}
  .hm-kr{grid-template-columns:repeat(2,minmax(0,1fr))}
  .hm-pd-stage{gap:.4rem;height:14rem}.hm-pd-v{font-size:.85rem}.hm-pd-n{font-size:.58rem;overflow-wrap:normal;left:-.2rem;right:-.2rem}.hm-pd-n small{font-size:.5rem}
  .hm-cc{grid-template-columns:minmax(0,1fr)}
}
@media (max-width:560px){.hm-cols{grid-template-columns:minmax(0,1fr)}.hm-cols .hm-st:nth-child(odd){padding-right:0;border-right:0}.hm-paper{padding:.9rem .85rem}.hm-mast-top{font-size:.5rem}}
@media (prefers-reduced-motion:reduce){.hm-st,.hm-rk li::after,.hm-pd-b,.hm-kr-ring,.hm-kr li{transition:none;animation:none}.hm-cc.lift .hm-cc-top{animation:none}}
