/* Paperclone — Problem page styles (loads after styles.css) */

.hero--problem{padding:72px var(--gutter) 0}
.hero--problem .hero__glow{top:-160px;left:-140px;right:auto;background:radial-gradient(circle at 60% 40%,#F9A76B,var(--orange) 65%,var(--orange) 100%);opacity:.14}
.hero--problem__title{max-width:1060px;font-size:clamp(36px,5.2vw,74px);line-height:1}
.hero--problem__sub{margin-top:28px;max-width:780px;font-size:clamp(16px,1.4vw,19px);line-height:1.55;color:rgba(18,48,14,.78)}

/* split-screen feeds */
.split{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:16px;margin-top:46px}
.feed{background:#fff;border:1px solid var(--ink-line);border-radius:20px;padding:22px}
.feed--now{background:var(--green);color:var(--green-paper);border-color:transparent}
.feed__head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:16px}
.feed__head .label{color:var(--ink-55)}
.feed--now .feed__head .label{color:var(--green-pale)}
.feed__year{
  font-family:var(--mono);font-size:9.5px;border:1px solid rgba(18,48,14,.2);
  border-radius:999px;padding:4px 8px;color:var(--ink-55);
}
.feed--now .feed__year{border-color:rgba(242,251,239,.3);color:rgba(242,251,239,.85)}
.feed__body{background:var(--cream);border-radius:14px;padding:14px}
.feed--now .feed__body{background:rgba(242,251,239,.08)}
.feed__profile{display:flex;align-items:center;gap:10px;padding-bottom:12px;border-bottom:1px solid var(--ink-line)}
.feed--now .feed__profile{border-bottom-color:rgba(242,251,239,.18)}
.feed__avatar{width:36px;height:36px;border-radius:50%;background:rgba(18,48,14,.14);flex:none}
.feed--now .feed__avatar{background:var(--orange-soft)}
.feed__lines{display:flex;flex-direction:column;gap:5px;flex:1}
.feed__lines i{display:block;height:8px;width:44%;border-radius:999px;background:rgba(18,48,14,.28)}
.feed__lines i:last-child{height:7px;width:66%;background:rgba(18,48,14,.14)}
.feed--now .feed__lines i{width:52%;background:rgba(242,251,239,.85)}
.feed--now .feed__lines i:last-child{width:74%;background:rgba(242,251,239,.4)}
.feed__flag{
  font-family:var(--mono);font-size:9px;white-space:nowrap;border-radius:999px;padding:3px 7px;
  border:1px solid rgba(155,224,150,.6);color:var(--green-pale);
}
.feed__posts{display:flex;flex-direction:column;gap:10px;padding-top:12px}
.feed--now .feed__posts{gap:9px}
.feed__post{display:flex;align-items:center;gap:10px;font-family:var(--mono);font-size:9.5px;color:rgba(18,48,14,.6);white-space:nowrap}
.feed__post i{height:7px;flex:1;border-radius:999px;background:rgba(18,48,14,.16);display:block}
.feed__post--dim{opacity:.75}
.feed--now .feed__post{color:var(--green-pale)}
.feed--now .feed__post i{background:rgba(242,251,239,.28)}
.feed__empty{
  height:58px;border-radius:10px;border:1px dashed rgba(18,48,14,.2);
  display:flex;align-items:center;justify-content:center;
  font-family:var(--mono);font-size:9.5px;letter-spacing:.06em;text-transform:uppercase;color:rgba(18,48,14,.5);
}
.feed__meta{display:flex;justify-content:space-between;font-family:var(--mono);font-size:9.5px;color:rgba(18,48,14,.6)}
.feed__faces{display:flex;align-items:center;gap:6px;margin-top:2px}
.feed__faces i{width:22px;height:22px;border-radius:50%;display:block;background:var(--orange-soft)}
.feed__faces i:nth-child(2){background:var(--green-pale);margin-left:-10px}
.feed__faces i:nth-child(3){background:rgba(242,251,239,.55);margin-left:-10px}
.feed__faces span{font-family:var(--mono);font-size:9.5px;color:rgba(242,251,239,.78);margin-left:6px}

/* two-column prose head */
.split-head{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:48px;align-items:start}
.prose{display:flex;flex-direction:column;gap:18px;font-size:clamp(15.5px,1.25vw,17.5px);line-height:1.6;color:rgba(18,48,14,.82)}
.prose--wide{max-width:860px;margin-top:28px}
.prose__pivot{font-weight:600;color:var(--ink);font-size:19px}
.prose__quote{font-family:var(--serif);font-style:italic;font-size:clamp(22px,2.4vw,30px);color:var(--green);line-height:1.15}

/* unsourced stat row */
.stat-row{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:14px;margin-top:40px}
.stat-card{background:#fff;border:1px solid var(--ink-line);border-radius:18px;padding:24px}
.stat-card__figure{font-size:44px;font-weight:700;letter-spacing:-.04em;line-height:1;color:var(--orange)}
.stat-card__label{margin-top:12px;font-size:15px;line-height:1.45;font-weight:600}
.stat-card__todo{margin-top:10px;font-family:var(--mono);font-size:10px;letter-spacing:.06em;text-transform:uppercase;color:var(--ink-55)}

/* the gate diagram */
.gate{background:var(--green);color:var(--green-paper);border-radius:var(--radius-lg);padding:clamp(28px,4vw,60px);display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:48px;align-items:center}
.gate__copy{display:flex;flex-direction:column;gap:18px;margin-top:28px;font-size:clamp(15.5px,1.2vw,17px);line-height:1.6;color:rgba(242,251,239,.88)}
.gate__panel{background:rgba(242,251,239,.07);border:1px solid rgba(242,251,239,.18);border-radius:20px;padding:22px}
.gate__buyer{display:flex;align-items:center;gap:12px;margin-bottom:16px}
.gate__buyer i{width:34px;height:34px;border-radius:50%;background:var(--orange-soft);flex:none;display:block}
.gate__buyer span{font-family:var(--mono);font-size:10.5px;letter-spacing:.08em;text-transform:uppercase;color:rgba(242,251,239,.82)}
.gate__checks{display:flex;flex-direction:column;gap:8px}
.gate__check{display:flex;align-items:center;justify-content:space-between;gap:10px;border:1px solid rgba(242,251,239,.22);border-radius:11px;padding:11px 13px}
.gate__check b{font-size:14px;font-weight:600}
.gate__check span{font-family:var(--mono);font-size:10px;color:var(--green-pale)}
.gate__flow{display:flex;justify-content:center;font-size:15px;color:rgba(242,251,239,.55);padding:10px 0}
.gate__fork{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.gate__outcome{background:rgba(242,251,239,.06);border:1px dashed rgba(242,251,239,.3);border-radius:14px;padding:16px}
.gate__outcome small{display:block;font-family:var(--mono);font-size:10px;letter-spacing:.08em;color:rgba(242,251,239,.75);margin-bottom:8px}
.gate__outcome b{font-size:24px;font-weight:700;letter-spacing:-.03em}
.gate__outcome--yes{background:var(--orange-soft);border:0;color:var(--orange-ink)}
.gate__outcome--yes small{color:var(--orange-ink)}

/* reference check */
.reference{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.15fr);gap:44px;margin-top:36px;align-items:start}
.scan{border:1px solid rgba(18,48,14,.14);border-radius:var(--radius);background:#fff;padding:20px}
.scan__title{font-family:var(--mono);font-size:10.5px;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-55);margin-bottom:14px}
.scan__shot{
  border:1px dashed rgba(18,48,14,.3);border-radius:16px;min-height:230px;padding:20px;
  display:flex;align-items:center;justify-content:center;text-align:center;
  background:repeating-linear-gradient(45deg,rgba(238,108,31,.07) 0 9px,rgba(238,108,31,0) 9px 18px);
  font-family:var(--mono);font-size:11.5px;letter-spacing:.06em;text-transform:uppercase;color:rgba(18,48,14,.6);line-height:1.5;
}
.scan__callouts{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:8px;margin-top:14px}
.scan__callout{display:flex;align-items:center;gap:8px;background:var(--cream);border-radius:10px;padding:10px 11px;font-size:12.5px;font-weight:600}
.scan__callout em{font-family:var(--mono);font-size:9.5px;font-style:normal;color:var(--orange)}

/* single vs distributed */
.volume{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:16px;margin-top:36px}
.volume__card{background:#fff;border:1px solid var(--ink-line);border-radius:20px;padding:24px}
.volume__card--dist{background:var(--sand);border-color:transparent}
.volume__card .label{display:block;margin-bottom:16px}
.volume__card--dist .label{color:var(--orange-deep)}
.volume__stack{display:flex;flex-direction:column;gap:5px}
.volume__row{display:flex;align-items:center;gap:8px}
.volume__row i{height:9px;flex:1;border-radius:999px;background:rgba(18,48,14,.16);display:block}
.volume__row span{font-family:var(--mono);font-size:9px;color:rgba(18,48,14,.5);width:34px;text-align:right}
.volume__grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.volume__op{background:#fff;border-radius:12px;padding:11px 10px;min-height:84px;display:flex;flex-direction:column;justify-content:space-between}
.volume__op i{width:22px;height:22px;border-radius:50%;background:var(--orange);display:block}
.volume__op span{font-family:var(--mono);font-size:9px;color:var(--green)}
.volume__op--soft i{background:var(--orange-soft)}
.volume__op--green{background:var(--green)}
.volume__op--green i{background:var(--green-light)}
.volume__op--green span{color:var(--green-paper)}
.volume__note{font-family:var(--mono);font-size:9.5px;letter-spacing:.06em;text-transform:uppercase;color:var(--ink-55);margin-top:14px}

/* symptoms */
.symptoms{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:14px}
.symptom{background:#fff;border:1px solid var(--ink-line);border-radius:20px;padding:24px}
.symptom__mark{height:48px;margin-bottom:18px;display:flex}
.symptom__mark--bleed{align-items:flex-end;gap:5px}
.symptom__mark--bleed i{width:12px;border-radius:3px;background:var(--orange);display:block}
.symptom__mark--bleed i:nth-child(1){height:100%}
.symptom__mark--bleed i:nth-child(2){height:72%;background:rgba(238,108,31,.75)}
.symptom__mark--bleed i:nth-child(3){height:52%;background:rgba(238,108,31,.55)}
.symptom__mark--bleed i:nth-child(4){height:34%;background:rgba(238,108,31,.35)}
.symptom__mark--bleed i:nth-child(5){height:20%;background:rgba(238,108,31,.22)}
.symptom__mark--deal{align-items:center;gap:8px}
.symptom__mark--deal i:nth-child(1){width:52px;height:14px;border-radius:999px 0 0 999px;background:var(--orange);display:block}
.symptom__mark--deal i:nth-child(2){width:2px;height:26px;background:rgba(18,48,14,.25);display:block}
.symptom__mark--deal i:nth-child(3){width:52px;height:14px;border-radius:0 999px 999px 0;background:rgba(18,48,14,.2);display:block}
.symptom__mark--fade{align-items:center;gap:7px}
.symptom__mark--fade i{border-radius:50%;display:block;background:var(--orange)}
.symptom__mark--fade i:nth-child(1){width:16px;height:16px}
.symptom__mark--fade i:nth-child(2){width:14px;height:14px;background:rgba(238,108,31,.6)}
.symptom__mark--fade i:nth-child(3){width:12px;height:12px;background:rgba(238,108,31,.35)}
.symptom__mark--fade i:nth-child(4){width:10px;height:10px;background:rgba(238,108,31,.2)}
.symptom__mark--fade i:nth-child(5){width:9px;height:9px;background:rgba(18,48,14,.1)}
.symptom .label{display:block;margin-bottom:10px}

/* what has to be true */
.truths{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:12px;margin-top:36px}
.truth{background:#fff;border:1px solid var(--ink-line);border-radius:18px;padding:22px;transition:border-color .18s ease}
.truth:hover{border-color:var(--green-bright)}
.truth__mark{margin-bottom:16px;display:flex}
.truth__name{font-size:20px;font-weight:700;letter-spacing:-.025em;margin-bottom:8px}
.truth p{font-size:15px;line-height:1.55;color:var(--ink-80)}
.truth__mark--dots{align-items:center;gap:5px}
.truth__mark--dots i{width:9px;height:9px;border-radius:50%;background:var(--orange);display:block}
.truth__mark--cadence{align-items:flex-end;gap:4px;height:14px}
.truth__mark--cadence i{width:9px;background:var(--orange);border-radius:2px;display:block;height:100%}
.truth__mark--cadence i:nth-child(2){height:60%}
.truth__mark--faces{align-items:center}
.truth__mark--faces i{width:14px;height:14px;border-radius:50%;background:var(--orange);display:block}
.truth__mark--faces i:nth-child(2){background:var(--orange-soft);margin-left:-5px}
.truth__mark--faces i:nth-child(3){background:var(--green-bright);margin-left:-5px}
.truth__mark--specific{width:32px;height:14px;border:2px solid var(--orange);border-radius:3px;position:relative}
.truth__mark--specific i{position:absolute;left:3px;top:3px;width:6px;height:4px;background:var(--orange);display:block}
.truth__mark--layered{flex-direction:column;gap:3px}
.truth__mark--layered i{height:4px;border-radius:2px;background:var(--orange);display:block;width:34px}
.truth__mark--layered i:nth-child(2){width:26px;background:rgba(238,108,31,.7)}
.truth__mark--layered i:nth-child(3){width:18px;background:rgba(238,108,31,.4)}
.truth__mark--ongoing{width:16px;height:16px;border-radius:50%;border:3px solid var(--orange);border-right-color:transparent}

.section__closing-line{margin-top:24px;font-family:var(--serif);font-style:italic;font-size:clamp(22px,2.4vw,32px);color:var(--green)}

/* closer variant */
.closer--problem{padding:clamp(40px,6vw,88px)}
.closer--problem h2{font-size:clamp(30px,4vw,56px);line-height:1.02}
.closer--problem .closer__inner{max-width:760px}
.closer--problem .closer__actions{margin-top:40px}
.btn--outline-light{border:1px solid rgba(242,251,239,.45);color:var(--green-paper);padding:15px 26px;font-size:16.5px}
.btn--outline-light:hover{border-color:var(--orange-soft);color:var(--orange-soft)}

@media (max-width:1000px){
  .reference{grid-template-columns:minmax(0,1fr);gap:32px}
  .gate,.split-head{gap:32px}
}
