/*
 * Retina Review — site styles (v6)
 * Location: bootscore-child/assets/css/retina-review.css
 * Loaded by the snippet in functions.php. Sections:
 *   1. Fonts  2. Site-wide  3. Home page (scoped under .rrh)  4. Launch page template
 */

/* 1. FONTS — self-hosted, no Google requests (SIL Open Font License) */
@font-face { font-family:'DM Serif Display'; src:url('../fonts/retina-review/DMSerifDisplay-Regular.woff2') format('woff2'); font-weight:400; font-style:normal; font-display:swap; }
@font-face { font-family:'Inter'; src:url('../fonts/retina-review/Inter-Regular.woff2') format('woff2'); font-weight:400; font-style:normal; font-display:swap; }
@font-face { font-family:'Inter'; src:url('../fonts/retina-review/Inter-Medium.woff2') format('woff2'); font-weight:500; font-style:normal; font-display:swap; }
@font-face { font-family:'Inter'; src:url('../fonts/retina-review/Inter-SemiBold.woff2') format('woff2'); font-weight:600; font-style:normal; font-display:swap; }
@font-face { font-family:'Inter'; src:url('../fonts/retina-review/Inter-Bold.woff2') format('woff2'); font-weight:700; font-style:normal; font-display:swap; }

/* 2. SITE-WIDE */
/* Use Inter for the whole site (menu, footer, other pages), not just the home page.
   Delete this rule if you prefer Bootstrap's default system font elsewhere. */
:root { --bs-body-font-family: 'Inter', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif; }

/* Full-width sections break out of the theme container; 'clip' prevents a
   sideways scrollbar without breaking the sticky header (unlike 'hidden'). */
html, body { overflow-x: clip; }

/* Home page: hide the page title and the gap above the content */
.home .entry-header { display: none; }
.home #content, .home .site-main, .home .entry-content { padding-top: 0 !important; margin-top: 0 !important; }
/* The hero runs straight on into the footer area: remove the theme's bottom spacing too */
.home #content { padding-bottom: 0 !important; }
/* Bootstrap's spacing classes (py-5, mt-4 ...) use !important, hence the !important above.
   If the hero ever slips under a FIXED menu, delete "margin-top: 0 !important;". */

/* 3. HOME PAGE */
.rrh { --navy:#0B2545; --navy2:#163560; --gold:#D4A847; --gold2:#E8C06A; --paper:#F7F9FC;
  --steel:#E4EAF2; --ink:#1C2B3A; --muted:#55657A;
  --serif:'DM Serif Display', Georgia, serif; --sans:'Inter', system-ui, sans-serif;
  font-family:var(--sans); color:var(--ink); font-size:17px; line-height:1.65; }
.rrh *, .rrh *::before, .rrh *::after { box-sizing:border-box; }
.rrh :where(h1,h2,h3,h4,p,ul,ol,dl,dd) { margin:0; padding:0; }
.rrh :where(h1,h2,h3,h4) { line-height:1.25; }
.rrh :where(a) { color:inherit; }
/* full-bleed sections even inside a theme container */
.rrh-bleed { width:100vw; margin-left:calc(50% - 50vw); }
.rrh-inner { max-width:1120px; margin:0 auto; padding:0 2rem; }
.rrh section.rrh-bleed { padding:5.5rem 0; }

.rrh-kicker { font-size:.78rem; font-weight:600; letter-spacing:.12em; text-transform:uppercase; color:#8A6A1C; margin-bottom:.9rem; }
.rrh-hero .rrh-kicker, .rrh-contribute .rrh-kicker { color:var(--gold); }
.rrh-h2 { font-family:var(--serif); font-weight:400; font-size:clamp(1.9rem,3.2vw,2.6rem); line-height:1.15; color:var(--navy); margin-bottom:1.1rem; }
.rrh-lead { color:var(--muted); max-width:60ch; margin-bottom:0; }

.rrh-btn { display:inline-block; padding:.8rem 1.7rem; border-radius:4px; font-weight:600; font-size:.95rem; text-decoration:none; transition:background .2s, color .2s, border-color .2s; }
.rrh-btn-gold { background:var(--gold); color:var(--navy); }
.rrh-btn-gold:hover { background:var(--gold2); color:var(--navy); }
.rrh-btn-line { border:1.5px solid rgba(255,255,255,.4); color:#fff; }
.rrh-btn-line:hover { border-color:var(--gold); color:var(--gold); }
.rrh-btn:focus-visible, .rrh a:focus-visible { outline:3px solid var(--gold2); outline-offset:3px; }

/* HERO */
.rrh-hero { background:var(--navy); color:#fff; overflow:hidden; }
.rrh .rrh-hero.rrh-bleed { padding:5rem 0 5.5rem; }
.rrh-hero-grid { display:grid; grid-template-columns:1.1fr .9fr; gap:3rem; align-items:center; }
.rrh-hero h1 { font-family:var(--serif); font-weight:400; font-size:clamp(2.6rem,5vw,4.1rem); line-height:1.05; color:#fff; margin-bottom:1.4rem; }
.rrh-hero h1 span { color:var(--gold); }
.rrh-hero p.rrh-hero-body { color:rgba(255,255,255,.75); font-size:1.1rem; max-width:44ch; margin-bottom:2.2rem; }
.rrh-hero-actions { display:flex; gap:1rem; flex-wrap:wrap; }
.rrh-hero-mark { display:flex; justify-content:center; }
.rrh-hero-mark svg { width:min(440px,100%); height:auto; }

/* BAND */
.rrh-band { background:var(--gold); }
.rrh .rrh-band.rrh-bleed { padding:1.4rem 0; }
.rrh-band .rrh-inner { display:flex; align-items:center; justify-content:space-between; gap:1.5rem; flex-wrap:wrap; }
.rrh-band p { color:var(--navy); font-weight:500; }
.rrh-band .rrh-btn { background:var(--navy); color:#fff; }
.rrh-band .rrh-btn:hover { background:var(--navy2); color:#fff; }

/* CONCEPT + AT A GLANCE */
.rrh-concept { background:var(--paper); }
.rrh-concept-grid { display:grid; grid-template-columns:1fr 1fr; gap:4.5rem; align-items:start; margin-top:2.5rem; }
.rrh-concept-text p { color:var(--muted); margin-bottom:1.1rem; max-width:58ch; }
.rrh-glance { background:var(--navy); color:#fff; border-radius:8px; padding:2.2rem 2.4rem; }
.rrh-glance h3 { font-family:var(--serif); font-weight:400; color:var(--gold); font-size:1.45rem; margin-bottom:1.3rem; }
.rrh-glance dl { margin:0; }
.rrh-glance dt { font-size:.72rem; font-weight:700; letter-spacing:.1em; text-transform:uppercase; color:var(--gold2); margin-top:1rem; }
.rrh-glance dt:first-child { margin-top:0; }
.rrh-glance dd { margin:.25rem 0 0; color:rgba(255,255,255,.8); font-size:.95rem; line-height:1.6; }

/* WHY HUMAN */
.rrh-why { background:var(--steel); }
.rrh-why-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:1.6rem; margin-top:2.8rem; }
.rrh-why-card { background:#fff; border-radius:8px; padding:2rem; }
.rrh-why-card h3 { font-family:var(--serif); font-weight:400; font-size:1.3rem; color:var(--navy); margin-bottom:.6rem; }
.rrh-why-card p { color:var(--muted); font-size:.95rem; }

/* READING DEPTH */
.rrh-depth { background:#fff; }
.rrh-depth-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:1.4rem; margin-top:2.8rem; }
.rrh-depth-item { border-top:3px solid var(--navy); padding-top:1.3rem; }
.rr-ic { width:1em; height:1em; display:block; text-align:center; line-height:1; }
.rrh { --fa-primary-color:currentColor; --fa-secondary-color:var(--gold); --fa-secondary-opacity:.55; }
.rrh-ic-wrap { display:inline-flex; align-items:center; justify-content:center; width:2.6rem; height:2.6rem; border-radius:50%; background:var(--navy); color:var(--gold); font-size:1.2rem; margin-bottom:1rem; }
.rrh-facts { display:grid; grid-template-columns:repeat(4,1fr); gap:1rem; margin-top:2.6rem; background:var(--paper); border-radius:8px; padding:1.3rem 1.6rem; }
.rrh-facts div { display:flex; align-items:center; gap:.7rem; font-size:.93rem; font-weight:500; color:var(--navy); }
.rrh-facts .rr-ic { color:#8A6A1C; font-size:1.1rem; flex-shrink:0; }
.rrh-steps { margin-top:3.5rem; }
.rrh-why-card .rrh-ic-wrap { background:var(--steel); color:var(--navy); }
.rrh-sponsor { background:#fff; }
.rrh-subscribe { background:var(--navy2); color:#fff; }
.rrh-subscribe .rrh-h2 { color:#fff; }
.rrh-subscribe .rrh-kicker { color:var(--gold); }
.rrh-subscribe .rrh-lead { color:rgba(255,255,255,.75); }
.rrh-subscribe-grid { display:grid; grid-template-columns:1fr 1fr; gap:4rem; align-items:center; }
.rrh-subscribe .rrh-form-panel { background:rgba(11,37,69,.55); }
.rrh-editor p.board { margin-top:1.1rem; padding-top:1rem; border-top:1px solid rgba(255,255,255,.15); font-size:.82rem; color:var(--gold2); }
.rrh-sponsor-grid { display:grid; grid-template-columns:1fr 1fr; gap:4rem; align-items:center; }
.rrh-sponsor .rrh-lead { margin-bottom:1.8rem; }
.rrh-btn-navy { background:var(--navy); color:#fff; }
.rrh-btn-navy:hover { background:var(--navy2); color:#fff; }
.rrh-sponsor-list { list-style:none; display:grid; gap:1.1rem; }
.rrh-sponsor-list li { display:grid; grid-template-columns:2.8rem 1fr; gap:1rem; align-items:start; background:var(--paper); border-radius:8px; padding:1.2rem 1.4rem; }
.rrh-sponsor-list .rr-ic { width:2.8rem; height:2.8rem; padding:.7rem; border-radius:50%; background:var(--navy); color:var(--gold); }
.rrh-sponsor-list h3 { font-size:1rem; font-weight:600; color:var(--navy); margin-bottom:.2rem; }
.rrh-sponsor-list p { font-size:.93rem; color:var(--muted); }
.rrh-depth-item h3 { font-size:1.02rem; font-weight:600; color:var(--navy); margin-bottom:.4rem; }
.rrh-depth-item p { color:var(--muted); font-size:.93rem; }


/* PROCESS */
.rrh-process { background:var(--paper); }
.rrh-steps { list-style:none; display:grid; grid-template-columns:repeat(5,1fr); gap:1.2rem; margin-top:3rem; counter-reset:rrh; position:relative; }
.rrh-steps::before { content:''; position:absolute; top:27px; left:8%; right:8%; height:2px; background:#CFD9E6; }
.rrh-steps li { counter-increment:rrh; text-align:center; position:relative; }
.rrh-steps li::before { content:counter(rrh); display:flex; align-items:center; justify-content:center; width:56px; height:56px; margin:0 auto 1rem; border-radius:50%; background:var(--navy); color:var(--gold); font-family:var(--serif); font-size:1.45rem; position:relative; z-index:1; }
.rrh-steps li.you::before { background:var(--gold); color:var(--navy); }
.rrh-steps h3 { font-size:.98rem; font-weight:600; color:var(--navy); margin-bottom:.35rem; }
.rrh-steps p { font-size:.86rem; color:var(--muted); line-height:1.55; }

/* CONTRIBUTE */
.rrh-contribute { background:var(--navy); color:#fff; }
.rrh-contribute .rrh-h2 { color:#fff; }
.rrh-contribute .rrh-lead { color:rgba(255,255,255,.7); }
.rrh-contribute-grid { display:grid; grid-template-columns:1fr 1fr; gap:4rem; align-items:start; margin-top:2.6rem; }
.rrh-reasons { list-style:none; }
.rrh-reasons li { display:grid; grid-template-columns:1.6rem 1fr; gap:.9rem; align-items:start; padding:1rem 0; border-bottom:1px solid rgba(255,255,255,.12); color:rgba(255,255,255,.85); }
.rrh-reasons li:last-child { border-bottom:none; }
.rrh-reasons .rr-ic { color:var(--gold); font-size:1.15rem; margin-top:.25rem; }
.rrh-form-panel { background:rgba(255,255,255,.06); border:1px solid rgba(255,255,255,.16); border-radius:8px; padding:2.2rem; }
.rrh-form-panel h3 { font-family:var(--serif); font-weight:400; color:var(--gold); font-size:1.4rem; margin-bottom:1.3rem; }

/* Ninja Forms inside the navy panel (also styles the preview mock form) */
.rrh-form-panel .nf-form-content { padding:0; max-width:none; }
.rrh-form-panel .nf-field-container { margin-bottom:1.1rem; }
.rrh-form-panel .nf-field-label label,
.rrh-form-panel label { display:block; font-size:.8rem; font-weight:600; color:rgba(255,255,255,.7); margin-bottom:.35rem; }
.rrh-form-panel .nf-form-content input.ninja-forms-field:not([type=button]):not([type=submit]):not([type=checkbox]),
.rrh-form-panel .nf-form-content select.ninja-forms-field,
.rrh-form-panel .nf-form-content textarea.ninja-forms-field,
.rrh-form-panel input[type=text], .rrh-form-panel input[type=email], .rrh-form-panel select, .rrh-form-panel textarea {
  width:100%; background:rgba(255,255,255,.08); border:1px solid rgba(255,255,255,.25); border-radius:4px;
  color:#fff; font-family:var(--sans); font-size:.95rem; padding:.65rem .85rem; height:auto; }
.rrh-form-panel .nf-form-content select.ninja-forms-field option, .rrh-form-panel select option { color:var(--ink); }
.rrh-form-panel ::placeholder { color:rgba(255,255,255,.4); }
.rrh-form-panel input:focus, .rrh-form-panel select:focus, .rrh-form-panel textarea:focus { outline:none; border-color:var(--gold); }
.rrh-form-panel .nf-form-content .listselect-wrap .nf-field-element div, .rrh-form-panel .nf-form-content .list-select-wrap .nf-field-element>div { background:transparent; border:none; }
.rrh-form-panel .nf-form-content .list-select-wrap>div div:after { color:var(--gold); }
.rrh-form-panel .nf-form-content input[type=submit], .rrh-form-panel .nf-form-content input[type=button], .rrh-form-panel button {
  width:100%; background:var(--gold); color:var(--navy); border:none; border-radius:4px; padding:.9rem;
  font-family:var(--sans); font-weight:700; font-size:1rem; cursor:pointer; }
.rrh-form-panel .nf-form-content input[type=submit]:hover, .rrh-form-panel button:hover { background:var(--gold2); color:var(--navy); }
.rrh-form-panel .nf-form-fields-required, .rrh-form-panel .nf-response-msg { color:rgba(255,255,255,.7); font-size:.85rem; }
.rrh-form-panel .nf-error-msg, .rrh-form-panel .ninja-forms-req-symbol { color:#FFB4A8; }
.rrh-form-panel .nf-field-description { color:rgba(255,255,255,.55); font-size:.8rem; }
.rrh-form-panel .checkbox-wrap label, .rrh-form-panel .nf-field-element label { color:rgba(255,255,255,.8); font-weight:400; }

/* ABOUT */
.rrh-about { background:var(--steel); }
.rrh-about-grid { display:grid; grid-template-columns:1.7fr 1fr; gap:4.5rem; align-items:center; }
.rrh-about p { color:var(--muted); margin-bottom:1rem; max-width:60ch; }
.rrh-kugler { display:flex; align-items:center; gap:1rem; margin-top:1.8rem; }
.rrh-kugler svg { height:46px; width:auto; }
.rrh-editor { background:var(--navy); border-radius:8px; padding:2.2rem; text-align:center; color:#fff; }
.rrh-editor-photo { width:84px; height:84px; border-radius:50%; background:var(--navy2); border:3px solid var(--gold); margin:0 auto 1rem; display:flex; align-items:center; justify-content:center; font-family:var(--serif); font-size:1.7rem; color:var(--gold); }
.rrh-editor .role { color:var(--gold); font-size:.75rem; font-weight:700; letter-spacing:.1em; text-transform:uppercase; margin-bottom:.4rem; }
.rrh-editor h3 { font-family:var(--serif); font-weight:400; font-size:1.35rem; margin-bottom:.4rem; }
.rrh-editor p { color:rgba(255,255,255,.7); font-size:.9rem; margin:0; }

@media (max-width: 960px) {
  .rrh-hero-grid, .rrh-concept-grid, .rrh-contribute-grid, .rrh-about-grid, 
  .rrh-facts { grid-template-columns:1fr 1fr; }
  .rrh-hero-mark svg { width:min(300px,80%); }
  .rrh-why-grid { grid-template-columns:1fr; }
  .rrh-depth-grid { grid-template-columns:1fr 1fr; }
  .rrh-steps { grid-template-columns:1fr; gap:1.6rem; }
  .rrh-steps::before { display:none; }
  .rrh-steps li { text-align:left; display:grid; grid-template-columns:56px 1fr; column-gap:1rem; }
  .rrh-steps li::before { margin:0; grid-row:span 2; }
  .rrh section.rrh-bleed { padding:4rem 0; }
}
@media (max-width: 560px) { .rrh-depth-grid, .rrh-facts { grid-template-columns:1fr; } .rrh-inner { padding:0 1.25rem; } }
@media (prefers-reduced-motion: reduce) { .rrh * { transition:none !important; } }

/* 4. LAUNCH PAGE TEMPLATE (page-templates/page-retina-review-launch.php) */
body.rr-launch { margin:0; background:#F7F9FC; }
.rr-launch-main { display:block; }
.rr-launch-footer { background:#06121F; color:rgba(255,255,255,.6); font-family:'Inter', system-ui, sans-serif; font-size:.85rem; line-height:1.6; }
.rr-lf-inner { max-width:1120px; margin:0 auto; padding:2.5rem 2rem 2rem; display:flex; justify-content:space-between; align-items:center; gap:1.5rem 2.5rem; flex-wrap:wrap; }
.rr-lf-logo { display:block; height:52px; width:auto; }
.rr-lf-pub { display:flex; align-items:center; gap:1.2rem 2rem; flex-wrap:wrap; }
.rr-lf-kugler img { display:block; height:34px; width:auto; }
.rr-launch-footer a { color:#D4A847; }
.rr-launch-footer a:hover { color:#E8C06A; }
.rr-lf-legal { max-width:1120px; margin:0 auto; padding:1rem 2rem 1.8rem; border-top:1px solid rgba(255,255,255,.08); font-size:.78rem; color:rgba(255,255,255,.45); }
@media (max-width:560px) { .rr-lf-inner, .rr-lf-legal { padding-left:1.25rem; padding-right:1.25rem; } }
