/* Colorful card theme: edit these variables first. No external fonts or images. */
:root {
  --ink: #f8f2ff;
  --muted: #bfc6dc;
  --paper: #120e20;
  --soft: #17142b;
  --line: #ffffff15;
  --brand: #ffd16f;
  --accent: #f5bf55;
  --gold: #ffd16f;
  --mint: #53dfbb;
  --lilac: #c7a0ff;
  --coral: #ff9a8a;
  --radius: 18px;
  --max: 1240px;
}
body { background: var(--paper); }
h1,h2,h3 { font-family: Georgia, 'Times New Roman', serif; letter-spacing: -.025em; }
h1 { font-size: clamp(38px,4.5vw,62px); }
h2 { font-size: clamp(30px,3.25vw,44px); }
p { color: var(--muted); }
a { text-underline-offset: 5px; }
.site-header { background: linear-gradient(110deg,#24143d,#17142f 65%,#143432); border-bottom: 1px solid #f5bf5555; }
.primary-nav a { color: #d5d5e8; }
.primary-nav a:hover,.primary-nav [aria-current=page] { background: #ffd16f19; color: var(--gold); }
.brand small { color: #c7b8dc; }
.button { background: linear-gradient(115deg,#ffe29a,#edab42); color: #30200c; box-shadow: 0 7px 25px #f2b94e20; border: 1px solid #ffe6a680; border-radius: 999px; }
.button:hover { background: linear-gradient(115deg,#fff0be,#ffcd71); box-shadow: 0 7px 26px #f2b94e40; }
.hero-section { padding: 64px 0 55px; background: radial-gradient(ellipse at 90% 15%,#4d235b66,transparent 55%),radial-gradient(ellipse at 5% 90%,#123d3b77,transparent 55%),#151123; }
.hero-copy .eyebrow { color: var(--mint); }
.hero-copy h1 { text-wrap: balance; }
.hero-copy>p { color: #c8cbde; }
.hero-note { color: #a9bad0; }
.status-dot { background: var(--mint); box-shadow: 0 0 10px #53dfbb66; }
.hero-grid { gap: 75px; }
.hero-grid figure { background: linear-gradient(140deg,#e3b85640,#8b55c73b); border-color: #ffd16f55; box-shadow: 0 20px 70px #0005,0 0 40px #b67ce315; }
.hero-grid figure:before { border-color: #ae86e355; }
.hero-grid figcaption { color: #d9c8b2; }
.topic-index { margin-top: 30px; background: linear-gradient(120deg,#241c35,#192c34); border-color: #ffffff20; }
.topic-index .eyebrow { color: var(--mint); }
.topic-index a { background: #ffffff08; border: 1px solid #ffffff13; color: #cec8e2; }
.topic-index a:hover { background: #ffd16f15; border-color: #ffd16f50; color: var(--gold); }
.content-section { border-top: 1px solid #ffffff09; padding-block: 70px; }
.cards-section { background: radial-gradient(ellipse at 5% 0%,#48264f25,transparent 60%),#15111f; }
.cards-section.palette-1 { background: radial-gradient(ellipse at 95% 100%,#183a3e44,transparent 65%),#111622; }
.cards-section.palette-2 { background: radial-gradient(ellipse at 0% 100%,#56301f33,transparent 65%),#1b111e; }
.cards-section.palette-3 { background: radial-gradient(ellipse at 95% 0%,#2d235955,transparent 65%),#161126; }
.article-row { display:block; }
.card-section-content { max-width:none; }
.section-heading { text-align:center; max-width:850px; margin:0 auto 36px; }
.section-marker { justify-content:center; flex-direction:row; align-items:center; gap:10px; margin-bottom:17px; color:var(--mint); font-size:10px; letter-spacing:2px; }
.section-marker span:first-child { border-color:#53dfbb45; color:var(--mint); background:#53dfbb0b; width:29px; height:29px; font-family:Arial,Helvetica,sans-serif; font-size:10px; }
.section-heading .section-description { font-size:16px; line-height:1.9; margin-top:19px; color:#bfc6dc; }
.feature-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:24px; align-items:stretch; }
.feature-grid.cols-4 { grid-template-columns:repeat(4,minmax(0,1fr)); gap:20px; }
.feature-card { --card-accent:var(--gold); --card-tint:#7c552525; position:relative; padding:30px 27px 29px; border:1px solid #d5b16d38; background:linear-gradient(145deg,#211b2e,#2b1c2b); border-radius:17px; box-shadow:0 9px 30px #00000015; transition:border-color .2s,transform .2s,box-shadow .2s; }
.feature-card:before { content:''; position:absolute; height:3px; top:0; left:28px; right:28px; background:var(--card-accent); opacity:.85; border-radius:0 0 4px 4px; }
.feature-card.tone-1 { --card-accent:var(--lilac); background:linear-gradient(145deg,#231c38,#241c30); border-color:#b38ce542; }
.feature-card.tone-2 { --card-accent:var(--mint); background:linear-gradient(145deg,#162d32,#1b2531); border-color:#53dfbb35; }
.feature-card.tone-3 { --card-accent:var(--coral); background:linear-gradient(145deg,#34212f,#292030); border-color:#ff9a8a38; }
.feature-card:hover { border-color:var(--card-accent); box-shadow:0 12px 32px #0003; transform:translateY(-4px); }
.card-title { display:flex; align-items:center; gap:13px; min-height:44px; }
.card-title h3 { color:var(--card-accent); font-size:24px; line-height:1.25; overflow-wrap:break-word; }
.card-icon { width:38px; height:38px; flex:0 0 38px; display:grid; place-items:center; border:1px solid #ffffff20; border-radius:11px; background:#ffffff08; color:var(--card-accent); font:23px Georgia,serif; }
.feature-card p { font-size:14px; line-height:1.85; margin-top:16px; color:#c7c9dd; }
.check-list { padding:0; margin:23px 0 0; list-style:none; }
.check-list li { position:relative; padding-left:24px; margin-top:15px; color:#dae0ee; font-size:14px; line-height:1.75; }
.check-list li:before { content:'✓'; position:absolute; left:0; top:-1px; color:var(--mint); font-size:18px; font-weight:bold; }
.cols-4 .feature-card { padding:27px 22px; }
.cols-4 .card-title { align-items:flex-start; flex-direction:column; gap:14px; }
.highlight-note { display:flex; justify-content:center; align-items:center; gap:14px; text-align:center; background:linear-gradient(100deg,#5f432b40,#3b233f80); border:1px solid #e9b85f40; border-radius:12px; padding:21px 28px; margin-top:28px; }
.highlight-note>span { color:var(--gold); font-size:23px; }
.highlight-note p { margin:0; font-size:14px; line-height:1.85; color:#e2cfae; }
.section-back { display:block; text-align:center; margin-top:26px; color:#b6a6d0; }
.security-panel { margin-top:30px; }
.security-panel h3 { font-size:23px; color:var(--mint); margin-bottom:20px; }
.security-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:15px; }
.security-grid>div { display:flex; align-items:center; gap:13px; padding:19px; background:#53dfbb09; border:1px solid #53dfbb35; border-radius:12px; color:#82e7cf; font-size:13px; font-weight:600; line-height:1.7; }
.security-grid span { font-size:24px; color:#c5fff0; }
.site-counts { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); margin-top:30px; border:1px solid #a884cc3a; border-radius:17px; background:linear-gradient(110deg,#251b37,#1b3038); padding:24px 0; }
.site-counts div { display:flex; flex-direction:column; align-items:center; gap:2px; text-align:center; border-right:1px solid #ffffff14; }
.site-counts div:last-child { border:0; }
.site-counts strong { font:700 35px Georgia,serif; color:var(--gold); }
.site-counts div:nth-child(2) strong { color:var(--lilac); }
.site-counts div:nth-child(3) strong { color:var(--mint); }
.site-counts span { color:#c3c5db; font-size:11px; }
.faq-intro { background:linear-gradient(110deg,#261a34,#172c31); }
.inline-note { align-items:center; }
.faq-section { background:radial-gradient(ellipse at 100% 100%,#48284d55,transparent 65%),#151321; }
.faq-section>.container>h2 { text-align:center; }
.faq-section>.container>.eyebrow { text-align:center; color:var(--mint); }
.faq-list { max-width:920px; margin-inline:auto; }
.faq-list details { background:linear-gradient(110deg,#231c31,#1c2531); border:1px solid #a885c333; padding:20px 23px; border-radius:12px; margin-top:12px; }
.faq-list details[open] { border-color:#ffd16f60; }
.faq-list summary { color:#e5dfee; font-size:16px; }
.faq-list summary:after { color:var(--gold); }
.faq-list details p { font-size:14px; }
.calculator { background:#1e2034; border-color:#b79ada44; max-width:900px; margin:30px auto 0; }
.calculator h3 { color:var(--gold); }
.calculator input { background:#101322; border-color:#695e82; color:white; }
.calculator label { color:#d5cbe6; }
.calculator output { color:var(--mint); }
.site-footer { background:linear-gradient(125deg,#20132d,#101e2a 70%,#10302b); border-top:1px solid #6d567a55; }
.footer-bottom { border-color:#ffffff20; }
.redirect-page { background:radial-gradient(ellipse at 90% 0%,#52285f,transparent 65%),#141126; }
.redirect-card { background:linear-gradient(140deg,#2d2039,#172b32); border:1px solid #ffd16f55; border-top:4px solid var(--gold); box-shadow:0 20px 70px #0005; }
@media(max-width:1000px) {
  .hero-grid { gap:35px; }
  .feature-grid.cols-4 { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .feature-grid { gap:16px; }
  .feature-card { padding:25px 20px; }
  .card-title { align-items:flex-start; flex-direction:column; gap:13px; }
  .card-title h3 { font-size:23px; }
  .security-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@media(max-width:700px) {
  .hero-grid { gap:32px; }
  .hero-section { padding-block:38px; }
  .hero-copy h1 { font-size:39px; }
  .hero-copy>p { font-size:15px; }
  .feature-grid,.feature-grid.cols-4 { grid-template-columns:1fr; gap:16px; }
  .content-section { padding-block:44px; }
  .section-heading { margin-bottom:26px; }
  .section-heading h2 { font-size:31px; }
  .section-heading .section-description { font-size:14px; margin-top:16px; }
  .feature-card,.cols-4 .feature-card { padding:26px 23px; }
  .card-title,.cols-4 .card-title { flex-direction:row; align-items:center; }
  .card-title h3 { font-size:24px; }
  .feature-card p { font-size:14px; }
  .check-list { margin-top:18px; }
  .check-list li { margin-top:13px; }
  .highlight-note { padding:19px 20px; align-items:flex-start; gap:10px; }
  .highlight-note p { font-size:13px; }
  .security-grid { grid-template-columns:1fr 1fr; gap:10px; }
  .security-grid>div { padding:14px 12px; font-size:11px; flex-direction:column; align-items:flex-start; gap:6px; }
  .security-panel h3 { font-size:23px; }
  .site-counts { margin-top:23px; padding:20px 0; }
  .site-counts strong { font-size:29px; }
  .site-counts span { font-size:9px; max-width:90px; line-height:1.6; }
  .topic-index { margin-top:23px; }
  .faq-list details { padding:17px 18px; }
  .faq-list summary { font-size:14px; }
  .inline-note h2 { font-size:29px; }
}
@media(prefers-reduced-motion:reduce) {
  .feature-card { transition:none; }
  .feature-card:hover { transform:none; }
}

/* Shared wordmark, square emblem, and page-specific article art. */
.site-header .brand img { width:154px; height:auto; border-radius:0; object-fit:contain; }
.hero-grid .hero-logo { width:min(100%,320px); justify-self:center; padding:30px; transform:none; }
.hero-grid .hero-logo img { width:220px; margin:auto; aspect-ratio:1; border-radius:22px; image-rendering:auto; }
.hero-grid .hero-logo figcaption { margin-top:15px; font-size:12px; line-height:1.6; }
.hero-copy .home-intro-extra { font-size:15px; line-height:1.9; }
.content-visual { display:grid; grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr); gap:45px; align-items:center; margin-block:35px 55px; padding:28px; border:1px solid #d6b06b38; background:linear-gradient(125deg,#251c35,#173039); border-radius:22px; }
.content-visual>img { width:100%; height:auto; aspect-ratio:1; object-fit:contain; border-radius:15px; }
.visual-copy { padding:15px; }
.visual-copy h2 { font-size:clamp(27px,3vw,38px); line-height:1.3; }
.visual-copy p { margin-top:20px; font-size:16px; line-height:1.9; }
.footer-brand { font-size:32px; }
@media(max-width:700px) {
  .site-header .brand img { width:115px; height:auto; }
  .hero-grid .hero-logo { width:240px; padding:25px; }
  .hero-grid .hero-logo img { width:170px; }
  .hero-grid .hero-logo figcaption { font-size:11px; }
  .hero-copy .home-intro-extra { font-size:14px; }
  .content-visual { grid-template-columns:1fr; gap:10px; padding:17px; margin-block:25px 35px; }
  .visual-copy { padding:13px 3px 4px; }
  .visual-copy h2 { font-size:27px; }
  .visual-copy p { font-size:14px; margin-top:13px; }
}
