
@font-face {
  font-family: "ArizonaFlare";
  src: url("../fonts/arizona_flare_300_normal_headings_h1-h6.woff2") format("woff2");
  font-weight: 300;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "HelveestiUI";
  src: url("../fonts/helveesti_400_normal_body_ui.woff2") format("woff2");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "HelveestiLabel";
  src: url("../fonts/helveesti_700_normal_body_labels.woff2") format("woff2");
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}

:root{
  --ff-head: "ArizonaFlare", serif; 
  --ff-body: "HelveestiUI", system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
  --ff-label: "HelveestiLabel", system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
}

html, body{ font-family: var(--ff-body); }
h1, h2, h3, h4, h5, h6{ font-family: var(--ff-head); font-weight: 300; }
strong, b, .btn, .eyebrow, .label{ font-family: var(--ff-label); font-weight: 700; }

*{
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  font-synthesis: none;
}

.section-pp{
  --pp-bg: var(--page-bg, #0b1220);
  --pp-ink: var(--page-ink, #e5e7eb);
  --pp-muted: var(--page-muted, #9aa4b2);
  --pp-accent: var(--brand, #c5151b);
  --pp-border: rgba(255,255,255,.12);

  background: var(--pp-bg);
  color: var(--pp-ink);
  padding-block: clamp(40px, 7vw, 88px);
  scroll-margin-top: 6rem; 
}

.section-pp{
  max-width: 76rem;           
  margin-inline: auto;
  padding-inline: 1rem;
  text-align: justify;
}

.pp-hero{ margin-bottom: 20px; }

.pp-title{
  font-family: var(--ff-head);
  letter-spacing: -0.01em;
  font-size: 36px;
  margin: 0 0 .5rem;
}

.pp-lead{
  font-family: var(--ff-body);
  color: var(--pp-muted);
  line-height: 1.3;
  font-size: 14px;
  margin: 0 0 .5rem;
}

.pp-meta{
  font-family: var(--ff-label);
  font-weight: 400;
  font-size: 14px;
  color: var(--pp-muted);
  margin: .15rem 0 0;
}

.pp-toc{
  border: 1px solid var(--pp-border);
  border-radius: 0px;
  padding: .9rem 1rem;
  background: linear-gradient(180deg, rgba(255,255,255,.02), rgba(255,255,255,0));
}
.pp-toc ul{
  display: flex;
  flex-wrap: wrap;
  gap: .6rem 1rem;
  padding: 0;
  margin: 0;
  list-style: none;
}
.pp-toc a{
  font-family: var(--ff-body);
  text-decoration: none;
  font-size: 14px;
  color: #c5151b;
  border-bottom: 1px dashed rgba(255,255,255,.25);
}
.pp-toc a:hover{ border-bottom-style: solid; }

.pp-section{
  padding-block: 1.25rem;
  border-top: 1px solid var(--pp-border);
}
.pp-section:first-of-type{ border-top: 0; }

.pp-section h2{
  font-family: var(--ff-head);
  font-weight: 300;
  font-size: clamp(22px, 2.8vw, 28px);
  margin: 0 0 .6rem;
}

.pp-section p{
  font-family: var(--ff-body);
  margin: 0 0 .9rem;
  line-height: 1.3;
  font-size: 14px;
  color: var(--pp-ink);
  text-align: justify;
}

.pp-list{
  font-family: var(--ff-body);
  margin: .35rem 0 1rem;
  padding-left: 1.2rem;
  max-width: 88ch;
}
.pp-list li{
  margin: .25rem 0;
  line-height: 1.3;
  font-size: 14px;
  color: var(--pp-ink);
}

.pp-note{ font-family: var(--ff-label); font-weight: 700; color: var(--pp-muted); font-size: .98rem; }
.pp-disclaimer{ margin-top: 1rem; color: var(--pp-muted); font-size: 16px; }

.section-svc{
  background: var(--page-bg, #0b0f16);
  color: var(--page-ink, #e5e7eb);
  padding-block: clamp(32px, 6vw, 72px);

  --svc-accent: var(--brand, #c5151b);
  --svc-surface: #0f0f10;
  --svc-border: rgba(255,255,255,0.08);
  --svc-muted: rgba(255,255,255,0.72);
  --svc-radius: 18px;
  --svc-gap: clamp(16px, 3.6vw, 32px);
}

.section-svc__head{
  text-align: center;
  margin-bottom: clamp(24px, 5vw, 56px);
}

.section-svc__eyebrow{
  font-family: var(--ff-label);
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  font-size: 12px;
  margin: 0 0 10px;
  color: var(--svc-muted);
}

.section-svc__title{
  font-family: var(--ff-head);
  font-weight: 300;
  font-size: clamp(26px, 4.5vw, 40px);
  line-height: 1.05;
  margin: 0 0 10px;
}

.section-svc__sub{
  font-family: var(--ff-body);
  max-width: 60ch;
  margin: 0 auto;
  color: var(--svc-muted);
  font-size: 16px;
  line-height: 1.6;
}

.svc-grid{
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: var(--svc-gap);
  grid-template-columns: 1fr;
}
@media (min-width: 700px){
  .svc-grid{ grid-template-columns: repeat(3, 1fr); }
}

.svc-card{
  border: 1px solid var(--svc-border);
  border-radius: var(--svc-radius);
  background: linear-gradient(180deg, rgba(255,255,255,0.02), rgba(255,255,255,0.00)), var(--svc-surface);
  padding: clamp(18px, 3.2vw, 28px);
  transition: border-color .2s ease, transform .2s ease;
  will-change: transform;
}
.svc-card:hover, .svc-card:focus-within{
  border-color: color-mix(in oklab, var(--svc-accent), #fff 40%);
  transform: translateY(-2px);
}

.svc-card__title{
  font-family: var(--ff-head);
  font-weight: 300;
  font-size: clamp(20px, 2.6vw, 24px);
  line-height: 1.1;
  margin: 0 0 8px;
}
.svc-card__text{
  font-family: var(--ff-body);
  color: var(--svc-muted);
  margin: 0;
  line-height: 1.7;
  font-size: 15px;
}

.section-svc__cta{
  display: flex;
  justify-content: center;
  margin-top: clamp(24px, 6vw, 56px);
}
.svc-btn{
  font-family: var(--ff-label);
  font-weight: 700;
  display: inline-block;
  text-decoration: none;
  padding: 12px 18px;
  border-radius: 999px;
  border: 1px solid color-mix(in oklab, var(--svc-accent), #fff 30%);
  background: var(--svc-accent);
  color: #fff;
  transition: transform .18s ease, opacity .18s ease, box-shadow .18s ease;
  box-shadow: 0 10px 24px rgba(197,21,27,.25);
}
.svc-btn:hover{ transform: translateY(-1px); }
.svc-btn:active{ transform: translateY(0); opacity: .95; }
.svc-btn:focus-visible{ outline: none; box-shadow: 0 0 0 .2rem rgba(197,21,27,.35); }

.visually-hidden{
  position: absolute !important;
  width: 1px; height: 1px;
  padding: 0; margin: -1px;
  overflow: hidden; clip: rect(0 0 0 0);
  white-space: nowrap; border: 0;
}

@media (prefers-reduced-motion: reduce){
  .svc-card,
  .svc-btn,
  .pp-toplink{
    transition: none;
  }
}
