/* Popwebsites · niche video pages. Colors, fonts and shapes come from the :root variables each page sets. */
body{background:var(--ground);color:var(--ink);font-family:var(--f-text)}
.lbl{font-family:var(--f-label);font-size:var(--label-size);font-weight:var(--label-weight);letter-spacing:var(--label-track);text-transform:uppercase;margin:0}
.d{display:inline-block;flex:none;width:7px;height:7px;border-radius:50%;background:var(--hero-em)}
.wrap{max-width:var(--max);margin:0 auto;padding-inline:var(--gut)}

.vh{background:var(--hero-bg);color:var(--hero-fg);border-bottom:1px solid var(--hero-rule)}
.vh .wrap{min-height:68px;display:flex;align-items:center;justify-content:space-between;gap:12px 16px;flex-wrap:wrap}
.vh .l{display:flex;align-items:center;gap:14px}
.vh .logo,.vf .logo{color:inherit;font-size:20px}
.vh .sep{width:1px;height:20px;background:var(--hero-rule)}
.vh .lbl{color:var(--hero-muted)}

.hero{background:var(--hero-bg);color:var(--hero-fg);padding:clamp(40px,6vw,88px) 0 clamp(64px,8vw,112px)}
.hero .who{display:flex;align-items:center;gap:10px;color:var(--hero-muted);margin-bottom:22px}
.hero h1{margin:0;max-width:1040px;font-weight:400;font-size:clamp(38px,5.2vw,78px);line-height:1.03;letter-spacing:var(--track-head)}
.hero h1 .a{display:block;font-family:var(--f-head);font-weight:var(--w-head);font-variation-settings:var(--vs-head)}
.hero h1 .b{display:block;font-family:var(--f-em);font-weight:var(--w-em);font-style:var(--em-style);font-variation-settings:var(--vs-em);color:var(--hero-em)}
.hero .lede{margin:24px 0 0;max-width:58ch;font-size:clamp(17px,1.5vw,20px);line-height:1.5;color:var(--hero-muted)}
.hero .vsl{margin-top:clamp(32px,4vw,56px)}
.hero .vsl .player{border-radius:var(--card-radius);border-color:var(--hero-rule)}
.cta-row{margin-top:clamp(28px,3.4vw,40px);display:flex;flex-wrap:wrap;align-items:center;gap:14px 24px}
.cta-row .lbl{color:var(--hero-muted)}
.hbtn,.dbtn{display:inline-flex;align-items:center;gap:12px;text-decoration:none;font-family:var(--f-text);font-weight:600;font-size:17px;line-height:1;padding:20px 28px;border-radius:var(--radius);white-space:nowrap;transition:filter .15s,transform .15s}
.hbtn{background:var(--hero-btn-bg);color:var(--hero-btn-fg)}
.dbtn{background:var(--btn-dark-bg);color:var(--btn-dark-fg);font-size:18px;padding:21px 30px}
.hbtn:hover,.dbtn:hover{filter:brightness(1.08)}
.hbtn:active,.dbtn:active{transform:translateY(1px)}

.what{padding:clamp(72px,9vw,128px) 0 0}
.what-row{display:flex;flex-wrap:wrap;gap:16px 64px;border-top:1px solid var(--rule);padding-top:32px}
.what-row .lbl{flex:0 0 200px;margin-top:8px;color:var(--muted)}
.what-row .big{flex:1 1 560px;min-width:0;margin:0;font-family:var(--f-title);font-weight:var(--w-title);font-variation-settings:var(--vs-title);font-size:clamp(24px,2.8vw,40px);line-height:1.16;letter-spacing:-.015em}
.flow{list-style:none;margin:clamp(40px,5vw,64px) 0 0;padding:0;display:flex;flex-wrap:wrap;align-items:stretch;gap:12px}
.flow .fstep{flex:1 1 210px;min-width:0;border:1px solid var(--rule);border-radius:var(--card-radius);padding:22px;display:flex;flex-direction:column;gap:8px;background:var(--surface)}
.flow .fstep .lbl{color:var(--muted)}
.flow .fstep b{font-family:var(--f-title);font-weight:var(--w-title);font-variation-settings:var(--vs-title);font-size:23px;line-height:1.12;letter-spacing:-.015em}
.flow .fstep span:last-child{color:var(--muted);font-size:15px;line-height:1.45}
.flow .fstep.last{background:var(--dark);color:var(--on-dark);border-color:var(--dark)}
.flow .fstep.last .lbl,.flow .fstep.last span:last-child{color:var(--on-dark-muted)}
.flow .arrow{flex:0 0 auto;display:flex;align-items:center;color:var(--accent);font-size:20px}

.pains{padding:clamp(72px,9vw,128px) 0}
.pains .lbl,.vids > .wrap > .lbl{color:var(--muted)}
.pains h2,.vids h2,.trust h2{margin:16px 0 0;max-width:860px;font-family:var(--f-title);font-weight:var(--w-title);font-variation-settings:var(--vs-title);font-size:clamp(32px,4vw,56px);line-height:1.05;letter-spacing:var(--track-head);text-wrap:balance}
.pain-list{list-style:none;margin:clamp(32px,4vw,52px) 0 0;padding:0;border-top:1px solid var(--rule);display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,300px),1fr));gap:0 40px}
.pain-list li{padding:28px 0;border-bottom:1px solid var(--rule);display:flex;flex-direction:column;gap:12px}
.pain-list .n{font-family:var(--f-label);font-size:var(--label-size);font-weight:var(--label-weight);letter-spacing:var(--label-track);color:var(--accent)}
.pain-list .t{font-family:var(--f-title);font-weight:var(--w-title);font-variation-settings:var(--vs-title);font-size:clamp(21px,2.1vw,27px);line-height:1.22}

.vids{background:var(--surface);padding:clamp(72px,9vw,128px) 0}
.vids .sub{margin:16px 0 0;max-width:56ch;color:var(--muted);font-size:18px}
.pillar{margin-top:clamp(48px,6vw,80px);display:flex;flex-wrap:wrap;gap:32px clamp(32px,5vw,72px);align-items:center;border-top:1px solid var(--rule);padding-top:clamp(36px,4.6vw,56px)}
.pillar.rev{flex-direction:row-reverse}
.pillar .txt{flex:1 1 380px;min-width:0}
.pillar .num{display:block;font-family:var(--f-title);font-weight:var(--w-title);font-variation-settings:var(--vs-title);font-size:clamp(48px,5.4vw,80px);line-height:.9;color:var(--accent)}
.pillar h3{margin:18px 0 0;font-family:var(--f-title);font-weight:var(--w-title);font-variation-settings:var(--vs-title);font-size:clamp(26px,2.8vw,38px);line-height:1.08;letter-spacing:var(--track-head)}
.pillar .txt > p{margin:14px 0 0;font-size:17px;color:var(--muted);max-width:46ch}
.pillar .txt ul{list-style:none;margin:20px 0 0;padding:0;display:flex;flex-direction:column;gap:10px;font-size:16px}
.pillar .txt li{display:flex;gap:12px}
.pillar .txt li::before{content:"";flex:none;width:6px;height:6px;border-radius:50%;background:var(--accent);margin-top:10px}
.vids .note{margin:clamp(40px,5vw,56px) 0 0;font-size:14px;color:var(--muted)}

/* illustrated media boxes (become a real video when /media/videos/<nicho>-<pilar>.mp4 exists) */
.media{position:relative;flex:1.3 1 520px;min-width:0;background:var(--soft);border-radius:var(--card-radius);padding:clamp(20px,2.6vw,36px) clamp(14px,2.6vw,36px)}
.media.has-video{padding-top:76px}
.media video.full{width:100%;border-radius:calc(var(--card-radius) / 2);background:#000;aspect-ratio:16/9}
.vpill{position:absolute;top:18px;left:18px;z-index:2;display:inline-flex;align-items:center;gap:10px;padding:6px 16px 6px 6px;border:0;border-radius:999px;background:var(--dark);color:var(--on-dark);font-family:var(--f-text);font-size:13px;font-weight:600;letter-spacing:.04em;text-transform:uppercase;cursor:pointer}
.vpill svg{width:32px;height:32px;padding:10px 9px 10px 11px;border-radius:50%;background:var(--on-dark);fill:var(--dark);box-sizing:border-box}

.ba{display:flex;align-items:center;gap:12px}
.ba .col{flex:1 1 0;min-width:0;display:flex;flex-direction:column;gap:8px}
.ba .col.wide{flex:1.25 1 0}
.ba .tag{font-family:var(--f-text);font-size:11px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}
.ba .tag.acc{color:var(--accent)}
.ba .to{flex:none;color:var(--accent);font-size:20px;margin-top:22px}
.win{border-radius:6px;overflow:hidden}
.win .bar{height:16px;display:flex;align-items:center;gap:4px;padding:0 7px}
.win .bar i{width:5px;height:5px;border-radius:50%}
.win .body{padding:10px;display:flex;flex-direction:column;gap:7px}
.win .r{display:flex;justify-content:space-between;align-items:center;gap:6px}
.win s{display:block;height:6px;text-decoration:none}
.win.old{background:#fff;border:1px solid #CFCFCF}
.win.old .bar{background:#E6E6E6}.win.old .bar i{background:#BDBDBD}
.win.old s{background:#E3E3E3}
.win.old .img{height:70px;background:#DADADA}
.win.old .oldtxt{font-family:'Times New Roman',Times,serif;font-size:12px;color:#6E6E6E}
.win.old .oldlink{font-family:'Times New Roman',Times,serif;font-size:11px;color:#1A0DAB;text-decoration:underline}
.win.new{background:var(--ground);border:1px solid var(--rule)}
.win.new .bar{background:var(--surface)}.win.new .bar i{background:var(--rule)}
.win.new .co{font-family:var(--f-title);font-weight:var(--w-title);font-variation-settings:var(--vs-title);font-size:10px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0}
.mini-btn{flex:none;align-self:flex-start;font-family:var(--f-text);font-size:8.5px;font-weight:600;padding:4px 8px;background:var(--btn-bg);color:var(--btn-fg);border-radius:var(--radius);white-space:nowrap}
.win.new .nh{font-family:var(--f-head);font-weight:var(--w-head);font-variation-settings:var(--vs-head);font-size:clamp(14px,1.5vw,19px);line-height:1.08}
.win.new .ns{font-size:9px;color:var(--muted)}
.win.new .photo{height:58px;background:var(--dark);display:flex;align-items:flex-end;padding:6px}
.win.new .photo span{font-size:8px;color:var(--on-dark-muted)}

.phone{flex:none;border:6px solid #111;border-radius:28px;overflow:hidden}
.admock,.botmock{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:24px}
.phone.ad{width:210px;background:#fff;color:#111;font-family:'Helvetica Neue',Arial,sans-serif}
.ad-top{display:flex;align-items:center;gap:8px;padding:10px 10px 8px}
.ad-top i,.chat-top i{flex:none;width:24px;height:24px;border-radius:50%;background:var(--dark)}
.ad-top span,.chat-top span{display:flex;flex-direction:column;min-width:0}
.ad-top b,.chat-top b{font-size:11px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ad-top small{font-size:9px;color:#6B6B6B}
.ad-copy{margin:0;padding:0 10px 8px;font-size:10px;line-height:1.35}
.ad-art{background:var(--dark);color:var(--on-dark);aspect-ratio:4/5;padding:14px;display:flex;flex-direction:column;justify-content:space-between}
.ad-art .k{font-family:var(--f-text);font-size:8px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--accent-on-dark)}
.ad-art b{font-family:var(--f-title);font-weight:var(--w-title);font-variation-settings:var(--vs-title);font-size:21px;line-height:1.05}
.ad-art .s{font-family:var(--f-text);font-size:10px;line-height:1.35;color:var(--on-dark-muted)}
.ad-foot{display:flex;justify-content:space-between;align-items:center;gap:8px;padding:8px 10px;background:#F2F2F2}
.ad-foot span{font-size:9px;color:#555;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ad-foot b{flex:none;font-size:9px;padding:5px 8px;background:#E1E3E8;border-radius:4px}
.plan{list-style:none;margin:0;padding:0;flex:1 1 220px;min-width:0;max-width:320px;border-top:1px solid var(--rule)}
.plan li{padding:12px 0;border-bottom:1px solid var(--rule);display:flex;flex-direction:column;gap:3px;font-size:15px;line-height:1.35}
.plan .lbl,.summary .lbl{font-size:11px;color:var(--accent);font-family:var(--f-text);font-weight:600;letter-spacing:.12em}

.phone.chat{width:236px;background:var(--ground);font-family:var(--f-text)}
.chat-top{display:flex;align-items:center;gap:8px;padding:10px;background:var(--dark);color:var(--on-dark)}
.chat-top i{background:var(--accent-on-dark)}
.chat-top small{font-size:9px;color:var(--on-dark-muted)}
.chat-body{padding:10px;display:flex;flex-direction:column;gap:6px}
.chat-body .when{align-self:center;font-size:9px;color:var(--muted);background:var(--surface);padding:2px 8px;border-radius:999px}
.msg{max-width:84%;padding:7px 9px;font-size:10.5px;line-height:1.35}
.msg.c{align-self:flex-end;background:#fff;color:#1A1A1A;border-radius:12px 12px 3px 12px}
.msg.a{align-self:flex-start;background:var(--dark);color:var(--on-dark);border-radius:12px 12px 12px 3px}
.summary{flex:1 1 200px;min-width:0;max-width:300px;background:var(--surface);border:1px solid var(--rule);border-radius:var(--card-radius);padding:18px}
.summary dl{margin:12px 0 0;display:flex;flex-direction:column;gap:10px}
.summary dl div{display:flex;flex-direction:column;gap:2px;border-top:1px solid var(--rule);padding-top:10px}
.summary dt{font-size:12px;color:var(--muted)}
.summary dd{margin:0;font-size:15px;font-weight:600}

.trust{background:var(--trust-bg);color:var(--trust-fg);padding:clamp(72px,9vw,120px) 0}
.trust .wrap{display:flex;flex-wrap:wrap;gap:32px clamp(40px,6vw,96px);align-items:flex-start}
.trust-l{flex:1 1 380px;min-width:0}
.trust-r{flex:1.2 1 440px;min-width:0}
.trust .shield{display:flex;align-items:center;gap:10px;color:var(--trust-muted)}
.trust .shield svg{flex:none;width:16px;height:16px;fill:none;stroke:var(--trust-accent);stroke-width:1.8}
.trust ul{list-style:none;margin:0;padding:0;border-top:1px solid var(--trust-rule)}
.trust li{display:flex;gap:14px;padding:18px 0;border-bottom:1px solid var(--trust-rule);font-size:18px;line-height:1.45}
.trust li::before{content:"";flex:none;width:7px;height:7px;border-radius:50%;background:var(--trust-accent);margin-top:11px}
.trust .case-line{margin:22px 0 0;font-size:15px;color:var(--trust-muted)}

.cta{background:var(--cta-bg);color:var(--on-dark);padding:clamp(80px,10vw,144px) 0}
.cta .lbl{display:flex;align-items:center;gap:10px;color:var(--on-dark-muted)}
.cta .lbl .d{background:var(--accent-on-dark)}
.cta h2{margin:18px 0 0;max-width:1000px;font-weight:400;font-size:clamp(40px,5.8vw,88px);line-height:1.02;letter-spacing:var(--track-head)}
.cta h2 .a{display:block;font-family:var(--f-head);font-weight:var(--w-head);font-variation-settings:var(--vs-head)}
.cta h2 .b{display:block;font-family:var(--f-em);font-weight:var(--w-em);font-style:var(--em-style);font-variation-settings:var(--vs-em);color:var(--accent-on-dark)}
.cta .sub{margin:22px 0 0;max-width:56ch;font-size:clamp(17px,1.5vw,20px);line-height:1.5;color:var(--on-dark-muted)}
.cta-go{margin-top:36px;display:flex;flex-wrap:wrap;align-items:center;gap:16px 28px}
.cta .dani{display:flex;align-items:center;gap:12px;font-size:15px;color:var(--on-dark-muted)}
.cta .dani img{flex:none;width:40px;height:40px;border-radius:50%;object-fit:cover;object-position:50% 30%}
.cta .invest{margin:40px 0 0;padding-top:20px;border-top:1px solid var(--dark-rule);font-size:14px;color:var(--on-dark-muted)}

.vf{background:var(--cta-bg);color:var(--on-dark-muted);border-top:1px solid var(--dark-rule)}
.vf .wrap{padding-block:28px;display:flex;flex-wrap:wrap;gap:14px 28px;justify-content:space-between;align-items:center;font-size:14px}
.vf .logo{color:var(--on-dark)}
.vf .mail{color:var(--on-dark);font-family:var(--f-mono);font-size:13px;text-decoration:none}

@media (max-width:720px){
  .hero{padding-bottom:56px}
  .what{padding-top:56px}
  .flow .arrow{display:none}
  .pillar.rev{flex-direction:column}
  .pillar{flex-direction:column;align-items:stretch}
  .media{flex-basis:auto}
  .hbtn,.dbtn{width:100%;justify-content:center}
}
@media (max-width:420px){
  .ba{gap:8px}
  .ba .to{display:none}
}
.vsl .player .cap .label{font-family:var(--f-label);font-weight:var(--label-weight);letter-spacing:var(--label-track)}
.vsl .player .cap b{font-family:var(--f-title);font-weight:var(--w-title);font-variation-settings:var(--vs-title)}
