/* beto.sh/press: press coverage of Beto and Betopia. Builds on home.css.
   Built page: scripts/build-press.py. Brand: docs/brand.md. */
.press .nav{margin-bottom:0}
.t-bb{--k:#2E7D6B;--ks:#D3E7DF;--kg:rgba(46,125,107,.22)}
.t-jo{--k:#C8553D;--ks:#F5D9C6;--kg:rgba(200,85,61,.2)}
.t-be{--k:#22264F;--ks:#DADCEC;--kg:rgba(247,149,73,.26)}
.t-qs{--k:#8A6114;--ks:#F1E1BC;--kg:rgba(217,164,65,.28)}

/* hero */
.press-hero{padding:clamp(56px,8vw,96px) 0 clamp(20px,3vw,32px);position:relative;overflow:hidden}
.press-hero::before{content:"";position:absolute;right:-12%;top:-30%;width:62%;aspect-ratio:1;border-radius:50%;background:radial-gradient(closest-side,rgba(247,149,73,.18),rgba(217,164,65,.08) 55%,transparent 75%);pointer-events:none}
.press-hero .wrap{position:relative}
.press-hero h1{font-size:clamp(38px,5vw,66px);max-width:14em}
.press-hero .lede{max-width:44em}
.pstat{display:inline-flex;flex-wrap:wrap;align-items:center;gap:6px 14px;margin-top:26px;padding:10px 18px;border-radius:999px;background:rgba(255,251,244,.7);border:1px solid var(--line);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);font-size:14.5px;color:var(--slate)}
.pstat b{font-family:var(--display);font-size:18px;color:var(--ink);margin-right:2px}
.pstat i{width:4px;height:4px;border-radius:50%;background:var(--line-2)}

/* the four products: no rule on top, a glow and an icon tile */
.prods{list-style:none;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;margin-top:26px}
.pr{position:relative;overflow:hidden;display:grid;grid-template-columns:auto 1fr;grid-template-rows:auto auto auto;column-gap:14px;row-gap:2px;align-items:center;padding:18px;border-radius:22px;background:linear-gradient(160deg,rgba(255,255,255,.92),rgba(255,251,244,.7));border:1px solid rgba(225,212,190,.8);box-shadow:0 1px 0 rgba(255,255,255,.8) inset,0 20px 40px -32px rgba(34,38,79,.45);transition:transform .2s,box-shadow .2s}
.pr::after{content:"";position:absolute;right:-40px;bottom:-60px;width:160px;height:160px;border-radius:50%;background:radial-gradient(closest-side,var(--kg),transparent);pointer-events:none}
.pr:hover{transform:translateY(-3px);box-shadow:0 1px 0 rgba(255,255,255,.8) inset,0 30px 50px -30px rgba(34,38,79,.5)}
.pi{grid-row:1/4;width:52px;height:52px;border-radius:16px;display:grid;place-items:center;background:var(--ks)}
.pi svg{width:26px;height:26px;fill:none;stroke:var(--k);stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.t-be .pi{background:linear-gradient(145deg,#2E336A,#22264F)}
.pi img{width:38px;height:38px}
.pr b{font-family:var(--display);font-size:17px}
.pl{font-size:13.5px;color:var(--dim);line-height:1.35}
.pm{font-size:12px;font-weight:700;color:var(--k);margin-top:4px}

/* the logo wall */
.wall{padding:clamp(20px,3vw,32px) 0}
.wall-k{font-size:12.5px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--dim);text-align:center}
.logos{list-style:none;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:12px;margin-top:16px}
.logos a{display:grid;place-items:center;height:76px;padding:12px 18px;border-radius:18px;background:#fff;border:1px solid var(--line);transition:transform .2s,box-shadow .2s,border-color .2s}
.logos img{width:100%;height:44px;object-fit:contain;filter:grayscale(1);opacity:.72;transition:filter .25s,opacity .25s}
.logos a:hover{transform:translateY(-2px);border-color:#e6d6c4;box-shadow:0 20px 34px -26px rgba(15,23,41,.45)}
.logos a:hover img{filter:none;opacity:1}

/* filters */
.press-list{padding-top:clamp(32px,4vw,56px)}
.pfilter{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin-bottom:24px}
.pfilter button{min-height:40px;padding:0 16px;border-radius:999px;border:1px solid var(--line-2);background:var(--white);font-size:14.5px;font-weight:600;color:var(--ink-2);transition:background .15s,color .15s,border-color .15s}
.pfilter button:hover{border-color:var(--ink)}
.pfilter button.on{background:var(--ink);border-color:var(--ink);color:var(--paper)}
.pfilter .sep{width:1px;height:24px;background:var(--line-2);margin:0 4px}

/* the news grid: a cover with the outlet's logo, then the story */
.pgrid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
.pc{display:flex}
.pc[hidden]{display:none}
.pc a{display:flex;flex-direction:column;width:100%;border-radius:26px;overflow:hidden;background:var(--white);border:1px solid var(--line);transition:transform .25s,box-shadow .25s,border-color .25s}
.pc a:hover{transform:translateY(-4px);border-color:#e6d6c4;box-shadow:0 34px 60px -40px rgba(15,23,41,.55)}
.cover{position:relative;display:grid;place-items:center;aspect-ratio:16/8;background:radial-gradient(70% 90% at 85% 0%,var(--cg,rgba(247,149,73,.22)),transparent 70%),radial-gradient(60% 80% at 0% 100%,rgba(46,125,107,.12),transparent 70%),linear-gradient(160deg,#F7F0E4,#EFE3CF);overflow:hidden}
.cover::before{content:"";position:absolute;inset:0;background-image:radial-gradient(rgba(34,38,79,.12) 1px,transparent 1.2px);background-size:16px 16px;-webkit-mask-image:linear-gradient(180deg,#000,transparent 85%);mask-image:linear-gradient(180deg,#000,transparent 85%)}
.cover.c-bb{--cg:rgba(46,125,107,.24)}
.plate{position:relative;display:block;box-sizing:border-box;width:min(66%,300px);height:84px;padding:12px 18px;border-radius:18px;background:#fff;box-shadow:0 20px 40px -24px rgba(34,38,79,.45),0 0 0 1px rgba(225,212,190,.6);transition:transform .35s cubic-bezier(.2,.8,.2,1)}
.plate img{width:100%;height:100%;object-fit:contain}
.pc a:hover .plate{transform:scale(1.04)}
.cover .lang{position:absolute;right:12px;top:12px;padding:4px 10px;border-radius:999px;background:rgba(255,251,244,.85);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);font-size:12px;font-weight:700;color:var(--slate)}
.cover .badge{position:absolute;left:12px;top:12px;padding:4px 11px;border-radius:999px;background:linear-gradient(135deg,#F4C76A,#F79549);color:#1b1e42;font-size:12px;font-weight:800}
.body{display:flex;flex-direction:column;gap:10px;flex:1;padding:20px 22px 22px}
.outlet{display:flex;align-items:baseline;gap:8px;flex-wrap:wrap}
.outlet b{font-size:14.5px}
.outlet small{font-size:13px;color:var(--dim);font-family:var(--bn)}
.pc h3{font-size:19px;line-height:1.3;letter-spacing:-.01em}
.pc h3:lang(bn){font-family:var(--bn);font-size:21px;font-weight:700;letter-spacing:0;line-height:1.35}
.pc .tr{font-size:14px;color:var(--dim);margin-top:-4px}
.pc .sum{font-size:15px;color:var(--slate)}
.tags{list-style:none;display:flex;flex-wrap:wrap;gap:6px;margin-top:auto;padding-top:4px}
.tags li{padding:4px 10px;border-radius:999px;background:var(--ks);color:var(--k);font-size:12.5px;font-weight:700}
.pc .go{font-size:14.5px;font-weight:700;color:var(--orange-ink)}
.pc .go i{font-style:normal;display:inline-block;transition:transform .2s}
.pc a:hover .go i{transform:translate(2px,-2px)}

/* the lead story: wide, cover on the left, on indigo */
.pc.lead{grid-column:span 2}
.pc.lead a{flex-direction:row;background:radial-gradient(120% 120% at 100% 0%,#2E7D6B 0,#22264F 62%);border-color:transparent;color:#F6EEE0}
.pc.lead .cover{width:44%;aspect-ratio:auto;background:radial-gradient(70% 70% at 50% 40%,rgba(247,149,73,.35),transparent 70%),linear-gradient(160deg,#2a2f6e,#1a1d47)}
.pc.lead .cover::before{background-image:radial-gradient(rgba(246,238,224,.16) 1px,transparent 1.2px)}
.pc.lead .plate{width:min(78%,340px);height:104px}
.pc.lead .body{padding:28px 30px}
.pc.lead .outlet small,.pc.lead .sum{color:#c9cfdb}
.pc.lead h3{font-size:clamp(22px,2.3vw,30px);color:#fff}
.pc.lead .tags li{background:rgba(246,238,224,.12);color:#F6EEE0}
.pc.lead .go{color:#F4C76A}

.pnote{margin-top:22px;font-size:14px;color:var(--dim)}

.press-contact{padding-top:0}
.pcontact{display:flex;align-items:center;justify-content:space-between;gap:24px;padding:clamp(24px,4vw,40px);border-radius:30px;background:var(--cream);border:1px solid var(--line)}
.pcontact .lede{margin-top:10px}
.pc-actions{display:flex;flex-wrap:wrap;gap:10px}

@media (max-width:1080px){
  .pgrid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .prods{grid-template-columns:repeat(2,minmax(0,1fr))}
  .logos{grid-template-columns:repeat(4,minmax(0,1fr))}
}
@media (max-width:940px){
  .press .links{position:static;opacity:1;transform:none;pointer-events:auto;flex-direction:row;background:none;border:0;box-shadow:none;padding:0;backdrop-filter:none}
  .press .menu-btn{display:none}
  .pcontact{flex-direction:column;align-items:flex-start}
  .pc.lead a{flex-direction:column}
  .pc.lead .cover{width:auto;aspect-ratio:16/8}
}
@media (max-width:620px){
  .pgrid,.prods{grid-template-columns:minmax(0,1fr)}
  .logos{grid-template-columns:repeat(2,minmax(0,1fr))}
  .pc.lead{grid-column:auto}
  .press .links a{padding:8px;font-size:14px}
  .press .nav-cta{display:none}
  .pfilter .sep{display:none}
  .pstat{border-radius:18px}
}
@media (prefers-reduced-motion:reduce){.pc a,.plate,.pr,.logos a{transition:none}}
