/*
Theme Name: Repretty Brand
Template: kadence
Version: 1.0.4
Text Domain: repretty-brand
*/

:root {
  --rp-carbon: #171716;
  --rp-ink: #242422;
  --rp-muted: #686963;
  --rp-paper: #f4f3ef;
  --rp-white: #ffffff;
  --rp-line: #d7d5ce;
  --rp-red: #b52b32;
  --rp-red-dark: #7b1f24;
  --rp-green: #5c7a45;
  --rp-blue: #315f7d;
  --rp-max: 1180px;
}

* { box-sizing: border-box; }

body {
  color: var(--rp-ink);
  background: var(--rp-paper);
  font-family: "Instrument Sans", sans-serif;
  font-size: 17px;
  line-height: 1.65;
  letter-spacing: 0;
}

h1, h2, h3, h4, h5, h6, p, a, button { letter-spacing: 0; }
h1, .rp-display { font-family: "Instrument Sans", sans-serif; font-weight: 650; }
h2, .rp-editorial { font-family: "Newsreader", Georgia, serif; font-weight: 600; }
h2 { font-size: clamp(34px, 4vw, 56px); line-height: 1.08; }
h3 { font-size: clamp(22px, 2.2vw, 30px); line-height: 1.2; }
a { color: var(--rp-red-dark); }
img { max-width: 100%; height: auto; }

.site-header, .site-main-header-wrap, .site-header-row-container-inner {
  background: var(--rp-carbon);
}
.site-header a, .site-header .menu-item > a, .site-header .site-title { color: var(--rp-white); }
.site-header .menu-item > a:hover, .site-header .current-menu-item > a { color: #ef9b9f; }
.site-title-wrap { display: none; }
.site-main-header-wrap .main-navigation .primary-menu-container > ul > li.menu-item > a {
  padding-right: 8px;
  padding-left: 8px;
  color: var(--rp-white);
  font-size: 15px;
}
.custom-logo { width: 152px; max-height: 48px; object-fit: contain; }
.site-header-row-container-inner { border-bottom: 1px solid #343431; }
.site-footer { color: #d8d8d2; background: var(--rp-carbon); }
.site-footer a { color: var(--rp-white); }

.content-area, .site-main, .entry-content-wrap, .entry-content { max-width: none; }
.content-container { max-width: none; padding: 0; }
.entry-content-wrap { padding: 0; background: transparent; box-shadow: none; }
.entry-header { display: none; }
.page .entry-hero { display: none; }
.page .content-area { margin: 0; }
.page .content-container.site-container { max-width: none; padding: 0; }
.page.content-style-boxed article.entry.content-bg:not(.loop-entry) { width: 100%; margin: 0; }
.entry-content > * { margin-top: 0; margin-bottom: 0; }

.rp-wrap { width: min(var(--rp-max), calc(100% - 40px)); margin: 0 auto; }
.rp-band { padding: 84px 0; }
.rp-band-white { background: var(--rp-white); }
.rp-band-dark { color: var(--rp-white); background: var(--rp-carbon); }
.rp-band-red { color: var(--rp-white); background: var(--rp-red-dark); }
.rp-band-red h2, .rp-band-red p { color: var(--rp-white); }
.rp-band-muted { background: #e9e7e1; }
.rp-kicker { margin: 0 0 12px; color: var(--rp-red); font-size: 13px; font-weight: 700; text-transform: uppercase; }
.rp-band-dark .rp-kicker, .rp-band-red .rp-kicker { color: #f1a4a8; }
.rp-lede { max-width: 760px; font-size: clamp(19px, 2vw, 24px); line-height: 1.5; }
.rp-note { color: var(--rp-muted); font-size: 14px; }
.rp-band-dark .rp-note, .rp-band-red .rp-note { color: #d0d0ca; }

.repretty-hero {
  position: relative;
  width: 100vw;
  min-height: min(720px, calc(100vh - 72px));
  margin-left: calc(50% - 50vw);
  display: flex;
  align-items: flex-end;
  color: var(--rp-white);
  background-image: var(--hero-image);
  background-position: center;
  background-size: cover;
  overflow: hidden;
}
.repretty-hero::before {
  position: absolute;
  inset: 0;
  content: "";
  background: rgba(17, 17, 16, .58);
}
.repretty-hero-content { position: relative; z-index: 1; width: min(720px, 100%); padding: 80px 0 72px; }
.repretty-hero h1 { margin: 0 0 20px; color: var(--rp-white); font-size: clamp(44px, 7vw, 82px); line-height: .98; }
.repretty-hero p { max-width: 640px; margin: 0 0 28px; font-size: clamp(18px, 2vw, 24px); line-height: 1.45; }
.repretty-hero .rp-kicker { color: #f4b3b7; }

.rp-actions { display: flex; flex-wrap: wrap; gap: 12px; align-items: center; }
.rp-button {
  display: inline-flex;
  min-height: 48px;
  align-items: center;
  justify-content: center;
  padding: 12px 22px;
  color: var(--rp-white);
  background: var(--rp-red);
  border: 1px solid var(--rp-red);
  border-radius: 3px;
  font-size: 14px;
  font-weight: 700;
  text-decoration: none;
}
.rp-button:hover { color: var(--rp-white); background: var(--rp-red-dark); border-color: var(--rp-red-dark); }
.rp-button-secondary { color: var(--rp-white); background: transparent; border-color: rgba(255,255,255,.72); }
.rp-button-secondary:hover { color: var(--rp-carbon); background: var(--rp-white); border-color: var(--rp-white); }
.rp-button-light { color: var(--rp-carbon); background: var(--rp-white); border-color: var(--rp-white); }
.rp-button-light:hover { color: var(--rp-white); background: var(--rp-carbon); border-color: var(--rp-carbon); }

.rp-proof { width: 100vw; margin-left: calc(50% - 50vw); background: var(--rp-carbon); border-top: 1px solid #353532; }
.rp-proof-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); }
.rp-proof-item { padding: 26px 20px; color: #d9d9d3; border-right: 1px solid #353532; }
.rp-proof-item:last-child { border-right: 0; }
.rp-proof-item strong { display: block; color: var(--rp-white); font-size: 23px; }

.rp-split { display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(320px, .95fr); gap: 64px; align-items: center; }
.rp-split-reverse { grid-template-columns: minmax(320px, .95fr) minmax(0, 1.05fr); }
.rp-product-image { width: 100%; max-height: 720px; object-fit: contain; background: var(--rp-white); }
.rp-hero-product-image { width: 100%; aspect-ratio: 16 / 10; object-fit: cover; }

.rp-stat-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); margin-top: 36px; border-top: 1px solid var(--rp-line); border-left: 1px solid var(--rp-line); }
.rp-stat { min-height: 120px; padding: 22px; border-right: 1px solid var(--rp-line); border-bottom: 1px solid var(--rp-line); }
.rp-stat strong { display: block; color: var(--rp-carbon); font-size: 23px; }
.rp-stat span { color: var(--rp-muted); font-size: 14px; }

.rp-columns { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 36px; margin-top: 34px; }
.rp-column { padding-top: 18px; border-top: 3px solid var(--rp-red); }
.rp-column h3 { margin: 0 0 10px; }

.rp-table { width: 100%; margin-top: 30px; border-collapse: collapse; background: var(--rp-white); border: 1px solid var(--rp-line); }
.rp-table th, .rp-table td { padding: 14px 16px; text-align: left; vertical-align: top; border-bottom: 1px solid var(--rp-line); }
.rp-table th { width: 34%; color: var(--rp-carbon); background: #e9e7e1; }
.rp-table tr:last-child th, .rp-table tr:last-child td { border-bottom: 0; }

.rp-steps { counter-reset: rp-step; margin-top: 34px; }
.rp-step { display: grid; grid-template-columns: 64px 1fr; padding: 22px 0; border-top: 1px solid var(--rp-line); }
.rp-step::before { counter-increment: rp-step; content: counter(rp-step, decimal-leading-zero); color: var(--rp-red); font-family: "Newsreader", Georgia, serif; font-size: 28px; }
.rp-step h3 { margin: 0 0 8px; }

.rp-quote { max-width: 900px; margin: 0; font-family: "Newsreader", Georgia, serif; font-size: clamp(28px, 4vw, 48px); line-height: 1.2; }
.rp-answer { max-width: 900px; padding-left: 22px; border-left: 4px solid var(--rp-red); }
.rp-answer strong { color: var(--rp-carbon); }

.rp-faq { border-top: 1px solid var(--rp-line); }
.rp-faq details { padding: 20px 0; border-bottom: 1px solid var(--rp-line); }
.rp-faq summary { cursor: pointer; color: var(--rp-carbon); font-size: 19px; font-weight: 700; }
.rp-faq details p { max-width: 820px; }

.rp-citation-list { padding-left: 20px; }
.rp-citation-list li { margin-bottom: 9px; }
.rp-legal { max-width: 850px; }
.rp-legal h2 { margin-top: 46px; font-size: 34px; }

@media (max-width: 900px) {
  .rp-split, .rp-split-reverse { grid-template-columns: 1fr; gap: 34px; }
  .rp-columns, .rp-stat-grid { grid-template-columns: 1fr 1fr; }
  .rp-proof-grid { grid-template-columns: 1fr 1fr; }
  .rp-proof-item:nth-child(2) { border-right: 0; }
  .repretty-hero { min-height: 650px; background-position: 62% center; }
}

@media (max-width: 620px) {
  body { font-size: 16px; }
  .rp-wrap { width: min(var(--rp-max), calc(100% - 28px)); }
  .rp-band { padding: 62px 0; }
  .repretty-hero { min-height: 620px; background-position: 58% center; }
  .repretty-hero-content { padding: 72px 0 54px; }
  .repretty-hero h1 { max-width: 12ch; font-size: 46px; }
  .rp-proof-grid, .rp-columns, .rp-stat-grid { grid-template-columns: 1fr; }
  .rp-proof-item { border-right: 0; border-bottom: 1px solid #353532; }
  .rp-proof-item:last-child { border-bottom: 0; }
  .rp-actions { align-items: stretch; flex-direction: column; }
  .rp-button { width: 100%; }
  .rp-table { display: block; overflow-x: auto; }
}
