/* ============================================================
   REIGNING CHOMP - About + Contact page styles
   ============================================================ */

/* ===== About ===== */
.story-hero { background: #0c0c0c; color:#fff; padding: clamp(56px,8vw,108px) 0; position:relative; overflow:hidden; }
.story-hero .eyebrow { color: var(--gold); }
.story-hero h1 { color:#fff; font-size: clamp(40px,7vw,84px); line-height:0.96; max-width: 16ch; }
.story-hero h1 .hl { color: var(--gold); }
.story-hero p { margin-top:22px; font-size: clamp(18px,2vw,22px); color:rgba(242,236,221,0.78); max-width:54ch; line-height:1.55; }

.story-body { padding: clamp(56px,8vw,100px) 0; }
.story-cols { display:block; }
.story-prose { max-width:760px; }
.story-prose p { font-size:18px; line-height:1.7; color:var(--ink); margin-bottom:20px; }
.story-prose p:last-child { margin-bottom:0; }
.story-prose strong { color: var(--gold); }

/* who it's for / not for */
.forwho { background: var(--char); }
.forwho-grid { display:grid; grid-template-columns:1fr 1fr; gap:24px; margin-top:40px; }
.forwho-card { background:var(--card); border:1px solid var(--card-line); border-radius:var(--radius); padding: clamp(28px,3.5vw,40px); box-shadow:var(--shadow-card); }
.forwho-card.no { background: #000; color:#fff; }
.forwho-card h3 { font-size:26px; margin-bottom:18px; }
.forwho-card.no h3 { color:#fff; }
.forwho-card ul { list-style:none; padding:0; margin:0; display:flex; flex-direction:column; gap:14px; }
.forwho-card li { display:flex; gap:12px; align-items:flex-start; font-size:16.5px; line-height:1.5; }
.forwho-card .mk { flex:none; font-family:var(--font-display); font-weight:700; font-size:18px; line-height:1.3; }
.forwho-card.yes .mk { color: #5fb33a; }
.forwho-card.no .mk { color: var(--gold); }
.forwho-card.no li { color: rgba(242,236,221,0.82); }

/* RC Dog character block */
.rcdog { display:grid; grid-template-columns: 0.9fr 1.1fr; gap: clamp(32px,5vw,64px); align-items:center; }
.rcdog .rc-portrait { aspect-ratio: 4/5; border-radius:var(--radius); overflow:hidden; box-shadow:var(--shadow-card); }
.rcdog .rc-portrait .ph { width:100%; height:100%; }
.rcdog blockquote { margin:0; font-family:var(--font-display); font-weight:500; font-size: clamp(22px,2.8vw,30px); line-height:1.22; color:var(--bone); }
.rcdog .rc-sign { margin-top:20px; color:var(--ink-soft); font-size:16px; }
.rcdog .rc-sign b { color:var(--gold); font-family:var(--font-display); }

/* ===== Contact ===== */
.contact-wrap { padding: clamp(40px,6vw,84px) 0 clamp(56px,8vw,100px); }
.contact-grid { display:grid; grid-template-columns: 1fr 1.15fr; gap: clamp(36px,6vw,80px); align-items:start; }
.contact-intro h1 { font-size: clamp(34px,5vw,58px); }
.contact-intro p { margin-top:18px; font-size:18px; line-height:1.6; color:var(--ink-soft); max-width:40ch; }
.contact-meta { margin-top:32px; display:flex; flex-direction:column; gap:18px; }
.contact-meta .cm { display:flex; gap:14px; align-items:flex-start; }
.contact-meta .cm .ci { flex:none; width:42px; height:42px; border-radius:11px; background:rgba(201,162,74,0.12); display:grid; place-items:center; }
.contact-meta .cm .ci svg { width:20px; height:20px; stroke:var(--gold); fill:none; stroke-width:2; }
.contact-meta .cm b { font-family:var(--font-display); font-weight:600; color:var(--gold); display:block; }
.contact-meta .cm span { color:var(--ink-soft); font-size:15px; }

.contact-form { background:var(--card); border-radius:var(--radius); padding: clamp(26px,3.5vw,40px); box-shadow:var(--shadow-card); border:1px solid var(--card-line); }
.field { margin-bottom:18px; }
.field label { display:block; font-family:var(--font-display); font-weight:600; font-size:15px; color:var(--gold); margin-bottom:8px; }
.field input, .field select, .field textarea {
  width:100%; padding:13px 15px; border-radius:10px; border:1.5px solid var(--card-line);
  font-family:var(--font-body); font-size:16px; color:var(--bone); background:var(--card-2);
  transition:border-color .15s var(--ease);
}
.field textarea { resize:vertical; min-height:130px; }
.field input:focus, .field select:focus, .field textarea:focus { outline:none; border-color:var(--accent); }
.contact-form .btn { width:100%; justify-content:center; margin-top:6px; }
.contact-privacy { margin-top:16px; color:var(--ink-soft); font-size:14px; line-height:1.5; }
.contact-privacy a { color:var(--gold); text-decoration:underline; text-underline-offset:3px; }
.contact-sent { display:none; text-align:center; padding:28px 10px; }
.contact-sent h3 { font-size:24px; }
.contact-sent p { color:var(--ink-soft); margin-top:10px; }
.contact-form.sent .field, .contact-form.sent .btn, .contact-form.sent .form-head, .contact-form.sent .contact-privacy { display:none; }
.contact-form.sent .contact-sent { display:block; }
.form-head { margin-bottom:22px; }
.form-head h2 { font-size:24px; }

@media (max-width: 860px) {
  .forwho-grid { grid-template-columns:1fr; }
  .rcdog { grid-template-columns:1fr; }
  .rcdog .rc-portrait { order:-1; aspect-ratio:16/11; }
  .contact-grid { grid-template-columns:1fr; }
}

/* ---- RC Dog portrait photo ---- */
.rc-portrait .rc-portrait-img { width:100%; height:100%; object-fit:cover; display:block; }

/* Customer information pages */
.policy-page { padding:56px 0 96px; }
.order-next { margin-top:32px; }
.order-help { margin-top:30px; color:var(--ink-soft); line-height:1.6; }
.order-help a { color:var(--gold); }
.policy-head { max-width:760px; padding-bottom:32px; border-bottom:1px solid var(--card-line); }
.policy-head .eyebrow { color:var(--gold); }
.policy-head h1 { font-size:42px; line-height:1.08; }
.policy-head p { margin-top:16px; color:var(--ink-soft); font-size:17px; line-height:1.6; }
.policy-links { display:flex; flex-wrap:wrap; gap:20px; margin:24px 0 44px; }
.policy-links a { color:var(--gold); font-weight:700; text-decoration:underline; text-underline-offset:5px; }
.policy-links a[aria-current="page"] { color:var(--bone); text-decoration-color:var(--gold); }
.policy-body { max-width:760px; }
.policy-body section { padding:26px 0; border-top:1px solid var(--card-line); }
.policy-body section:first-child { border-top:0; padding-top:0; }
.policy-body h2 { font-size:25px; line-height:1.2; margin-bottom:12px; }
.policy-body h3 { font-size:18px; line-height:1.3; margin:20px 0 8px; }
.policy-body p, .policy-body li, .policy-body dd { color:var(--ink-soft); font-size:16px; line-height:1.65; }
.policy-body p + p { margin-top:14px; }
.policy-body ul { padding-left:24px; margin:12px 0; }
.policy-body li + li { margin-top:8px; }
.policy-body a { color:var(--gold); text-decoration:underline; text-underline-offset:3px; }
.policy-body .btn--primary { color:var(--accent-ink); text-decoration:none; }
.policy-body table { width:100%; border-collapse:collapse; margin:16px 0; }
.policy-body th, .policy-body td { padding:12px 8px; border-bottom:1px solid var(--card-line); text-align:left; vertical-align:top; color:var(--ink-soft); line-height:1.5; }
.policy-body th { color:var(--bone); }
.policy-body dl { margin:16px 0; }
.policy-body dt { font-weight:700; margin-top:10px; }
.policy-body dd { margin:4px 0 0; }
@media (max-width:600px) {
  .policy-page { padding:36px 0 72px; }
  .policy-head h1 { font-size:32px; }
  .policy-links { gap:16px; }
  .policy-body h2 { font-size:22px; }
}