/* Pocket Cactus pages: the game's Desert Modern look (teal band, bone paper, rust, Futura captions).
   Shared by support.html and privacy.html. Studio chrome comes from /assets/forgelight.css. */
:root {
  --pc-teal: #1e4d52; --pc-teal-deep: #163a3e; --pc-teal-line: rgba(242, 238, 227, .16);
  --pc-bone: #f2eee3; --pc-sand: #e8e2d2; --pc-ink: #23302f; --pc-soft: #55605e;
  --pc-rust: #a0472a; --pc-rust-ink: #8a3a20; --pc-sage: #acd199; --pc-gold: #e9c75a; --pc-clay: #c9734f;
  --pc-display: Futura, "Futura PT", "Trebuchet MS", system-ui, sans-serif;
  --pc-body: "Avenir Next", Avenir, system-ui, -apple-system, "Segoe UI", sans-serif;
  --pc-latin: Georgia, "Times New Roman", serif;
}
body { margin: 0; min-height: 100vh; background: var(--pc-teal); color: var(--pc-bone); font: 17px/1.6 var(--pc-body); display: flex; flex-direction: column; }
.pc { flex: 1 0 auto; overflow-x: clip; }
.pc *, .pc *::before, .pc *::after { box-sizing: border-box; }
.pc a { color: inherit; }
.pc a:focus-visible { outline: 3px solid var(--pc-gold); outline-offset: 3px; border-radius: 4px; }
.pc-wrap { width: min(1000px, 100% - 32px); margin-inline: auto; }

/* hero */
.pc-hero { padding: 48px 0 40px; background-image: radial-gradient(rgba(242,238,227,.07) 1.2px, transparent 1.4px); background-size: 22px 22px; }
.pc-hero-grid { display: grid; gap: 32px; align-items: center; }
@media (min-width: 820px) { .pc-hero-grid { grid-template-columns: minmax(0, 1fr) 280px; gap: 56px; } }
.pc-eyebrow { margin: 0 0 12px; font: 700 13px/1.4 var(--pc-display); letter-spacing: .18em; text-transform: uppercase; color: var(--pc-sage); }
.pc-title { margin: 0; font: 700 clamp(44px, 10vw, 76px)/1 var(--pc-display); letter-spacing: -.01em; color: var(--pc-bone); text-shadow: 3px 3px 0 var(--pc-teal-deep); }
.pc-sub { margin: 10px 0 0; font: 700 clamp(18px, 3.6vw, 22px)/1.3 var(--pc-display); letter-spacing: .08em; text-transform: uppercase; color: var(--pc-gold); }
.pc-lede { margin: 18px 0 0; max-width: 56ch; font-size: 19px; color: rgba(242,238,227,.92); }
.pc-pill { display: inline-flex; align-items: center; gap: 8px; margin: 22px 0 0; padding: 7px 14px; border: 1px solid var(--pc-teal-line); border-radius: 999px; font: 600 14px/1.3 var(--pc-body); color: var(--pc-bone); background: rgba(22,58,62,.6); }
.pc-pill::before { content: ""; width: 7px; height: 7px; border-radius: 50%; background: var(--pc-gold); }
.pc-cta { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 22px; }
.pc-btn { display: inline-flex; align-items: center; justify-content: center; min-height: 48px; padding: 12px 22px; border-radius: 10px; font: 700 16px/1.2 var(--pc-display); letter-spacing: .02em; text-decoration: none; }
.pc .pc-btn-main { background: var(--pc-rust); color: var(--pc-bone); box-shadow: 0 4px 0 var(--pc-rust-ink); }
.pc .pc-btn-main:hover { background: #b0532f; }
.pc .pc-btn-ghost { border: 2px solid var(--pc-bone); color: var(--pc-bone); }
.pc .pc-btn-ghost:hover { background: rgba(242,238,227,.08); }
.pc-badges { list-style: none; display: flex; flex-wrap: wrap; gap: 8px; margin: 22px 0 0; padding: 0; }
.pc-badges li { padding: 4px 11px; border: 1px solid rgba(143,184,122,.5); border-radius: 6px; font: 600 13px/1.5 var(--pc-body); color: var(--pc-sage); }
.pc-hero-shot { justify-self: center; width: min(280px, 72vw); margin: 0; }
.pc-hero-shot img { display: block; width: 100%; height: auto; border-radius: 22px; box-shadow: 10px 10px 0 var(--pc-teal-deep); }

/* in-page nav */
.pc-jump { border-block: 1px solid var(--pc-teal-line); background: var(--pc-teal-deep); }
.pc-jump ul { list-style: none; display: flex; flex-wrap: wrap; justify-content: center; gap: 4px 22px; margin: 0 auto; padding: 6px 16px; }
.pc-jump a { display: inline-flex; align-items: center; min-height: 44px; font: 700 14px/1 var(--pc-display); letter-spacing: .1em; text-transform: uppercase; text-decoration: none; color: rgba(242,238,227,.82); }
.pc-jump a:hover { color: var(--pc-gold); }

/* sections */
.pc-sec { padding: 56px 0 8px; scroll-margin-top: 72px; }
.pc-kicker { margin: 0; font: 700 13px/1.4 var(--pc-display); letter-spacing: .18em; text-transform: uppercase; color: var(--pc-sage); }
.pc-h2 { margin: 8px 0 12px; font: 700 clamp(28px, 5.4vw, 40px)/1.1 var(--pc-display); color: var(--pc-bone); text-shadow: 2px 2px 0 var(--pc-teal-deep); }
.pc-intro { margin: 0 0 26px; max-width: 62ch; color: rgba(242,238,227,.9); }
.pc-cards { display: grid; gap: 16px; grid-template-columns: minmax(0, 1fr); }
@media (min-width: 620px) { .pc-cards { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 900px) { .pc-cards--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.pc-card { position: relative; margin: 0; padding: 22px 20px 20px; border-radius: 12px; background: var(--pc-bone); color: var(--pc-ink); box-shadow: 5px 5px 0 var(--pc-teal-deep); }
.pc-card h3 { display: flex; align-items: center; gap: 10px; margin: 0 0 8px; font: 700 19px/1.25 var(--pc-display); letter-spacing: .02em; color: var(--pc-teal); }
.pc-card p { margin: 0 0 10px; }
.pc-card p:last-child { margin-bottom: 0; }
.pc-num { flex: none; display: inline-grid; place-items: center; width: 30px; height: 30px; border-radius: 50%; background: var(--pc-rust); color: var(--pc-bone); font: 700 15px/1 var(--pc-display); }
.pc-icon { flex: none; width: 30px; height: 30px; }
.pc-latin { font-family: var(--pc-latin); font-style: italic; }

/* screenshot strip */
.pc-shots { list-style: none; display: grid; grid-auto-flow: column; grid-auto-columns: minmax(180px, 220px); gap: 16px; margin: 0; padding: 4px 4px 18px; overflow-x: auto; scroll-snap-type: x mandatory; overscroll-behavior-x: contain; }
.pc-shots li { scroll-snap-align: start; }
.pc-shots figure { margin: 0; }
.pc-shots img { display: block; width: 100%; height: auto; border-radius: 16px; box-shadow: 5px 5px 0 var(--pc-teal-deep); }
.pc-shots figcaption { margin-top: 10px; font: 600 14px/1.4 var(--pc-body); color: rgba(242,238,227,.85); }

/* numbers band */
.pc-stats { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; margin: 0 0 18px; }
@media (min-width: 760px) { .pc-stats { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
.pc-stat { margin: 0; padding: 16px 12px; border: 2px dashed var(--pc-teal-line); border-radius: 12px; text-align: center; }
.pc-stat dt { font: 700 clamp(30px, 6vw, 40px)/1 var(--pc-display); color: var(--pc-gold); }
.pc-stat dd { margin: 6px 0 0; font: 600 14px/1.35 var(--pc-body); color: rgba(242,238,227,.88); }
.pc-total { margin: 0 0 26px; font: 700 clamp(18px, 3.4vw, 22px)/1.4 var(--pc-display); color: var(--pc-bone); }
.pc-total strong { color: var(--pc-gold); }

/* list inside cards */
.pc-list { margin: 6px 0 0; padding-left: 20px; }
.pc-list li { margin-bottom: 6px; }

/* FAQ */
.pc-faq { display: grid; gap: 12px; }
.pc-faq details { border-radius: 12px; background: var(--pc-bone); color: var(--pc-ink); box-shadow: 5px 5px 0 var(--pc-teal-deep); }
.pc-faq summary { display: flex; align-items: center; justify-content: space-between; gap: 16px; min-height: 56px; padding: 14px 20px; cursor: pointer; list-style: none; font: 700 17px/1.35 var(--pc-display); color: var(--pc-teal); }
.pc-faq summary::-webkit-details-marker { display: none; }
.pc-faq summary::after { content: "+"; flex: none; font: 700 24px/1 var(--pc-display); color: var(--pc-rust); }
.pc-faq details[open] summary::after { content: "–"; }
.pc-faq summary:focus-visible { outline: 3px solid var(--pc-rust); outline-offset: 2px; border-radius: 12px; }
.pc-faq .pc-a { margin: 0; padding: 0 20px 18px; }

/* contact */
.pc-contact { margin: 56px 0 0; padding: 44px 0 52px; background: var(--pc-teal-deep); text-align: center; }
.pc-contact .pc-intro { margin-inline: auto; }
.pc-mail { display: inline-block; margin-top: 6px; font: 700 clamp(16px, 4.4vw, 22px)/1.4 var(--pc-display); color: var(--pc-gold); overflow-wrap: anywhere; }
.pc-contact .pc-cta { justify-content: center; }
.pc-links { display: flex; flex-wrap: wrap; justify-content: center; gap: 0 18px; margin-top: 22px; font-size: 15px; }
.pc-links a { display: inline-flex; align-items: center; min-height: 44px; color: rgba(242,238,227,.85); }

/* privacy */
.pc-doc { width: min(760px, 100% - 32px); margin: 0 auto; padding: 40px 0 56px; }
.pc-back { display: inline-flex; align-items: center; min-height: 44px; font-size: 15px; color: rgba(242,238,227,.88); }
.pc-doc .pc-title { font-size: clamp(40px, 9vw, 60px); margin-top: 10px; }
.pc-stamp { display: inline-block; margin: 18px 0 0; padding: 8px 16px; border: 2px solid var(--pc-sage); border-radius: 999px; font: 700 14px/1 var(--pc-display); letter-spacing: .12em; text-transform: uppercase; color: var(--pc-sage); }
.pc-paper { margin-top: 30px; padding: 8px 22px 26px; border-radius: 14px; background: var(--pc-bone); color: var(--pc-ink); box-shadow: 6px 6px 0 var(--pc-teal-deep); }
@media (min-width: 620px) { .pc-paper { padding: 12px 40px 34px; } }
.pc-paper h2 { margin: 26px 0 8px; padding-top: 18px; border-top: 2px dashed #d6cdb8; font: 700 21px/1.25 var(--pc-display); color: var(--pc-teal); }
.pc-paper h2:first-child { border-top: 0; padding-top: 8px; }
.pc-paper p { margin: 0 0 12px; }
.pc-paper ul { margin: 0 0 12px; padding-left: 22px; }
.pc-paper li { margin-bottom: 6px; }
.pc-paper a { color: var(--pc-rust-ink); text-underline-offset: 3px; }
.pc-meta { margin: 18px 0 0; font-size: 15px; color: rgba(242,238,227,.8); }

/* studio footer on teal */
.fl-footer { margin-top: 0; background: var(--pc-teal-deep); border-top-color: var(--pc-teal-line); color: rgba(242,238,227,.62); }
.fl-footer a { color: rgba(242,238,227,.82); display: inline-block; white-space: nowrap; }
@media (prefers-reduced-motion: reduce) { .pc-shots { scroll-behavior: auto; } }