*{margin:0;padding:0;box-sizing:border-box}
body{font-family:Georgia,'Times New Roman',serif;line-height:1.8;color:#222;background:#f4f1eb}
.Nav_foot__OSqAf{max-width:1100px;margin:0 auto;padding:0 24px}
.Footer_text__zyXY6{background:linear-gradient(135deg,#2c3e50,#34495e);color:#fff;padding:48px 0;text-align:center;margin-bottom:48px}
.Footer_text__zyXY6 h1{font-size:36px;letter-spacing:2px;text-transform:uppercase;margin-bottom:6px}
.Footer_text__zyXY6 p{font-size:16px;opacity:.8;font-style:italic}
.Footer_text__zyXY6 .Container_head__3xyBZ{color:#fff;text-decoration:none;font-size:20px;letter-spacing:1px;text-transform:uppercase}
.Grid_text__aWfxT{display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:28px}
.Page_box__2O6t7{background:#fff;border-radius:4px;box-shadow:0 2px 12px rgba(0,0,0,.08);padding:28px;transition:box-shadow .2s}
.Page_box__2O6t7:hover{box-shadow:0 4px 20px rgba(0,0,0,.14)}
.Page_box__2O6t7 h2{font-size:22px;margin-bottom:10px;line-height:1.3}
.Page_box__2O6t7 h2 a{color:#2c3e50;text-decoration:none}
.Page_box__2O6t7 .Nav_title__iODDu{font-size:12px;color:#888;margin-bottom:10px;text-transform:uppercase;letter-spacing:1px}
.Page_box__2O6t7 p{font-size:15px;color:#555;margin-bottom:14px}
.Hero_area__O2HpQ{color:#e74c3c;text-decoration:none;font-weight:700;font-size:13px;text-transform:uppercase;letter-spacing:.5px}
.Hero_main__iu7yh{max-width:780px;margin:0 auto;padding:0 24px 60px}
.Hero_main__iu7yh h1{font-size:36px;margin-bottom:10px;line-height:1.2}
.Hero_main__iu7yh .Nav_title__iODDu{font-size:13px;color:#888;display:block;margin-bottom:28px;text-transform:uppercase;letter-spacing:1px}
.Hero_main__iu7yh h2{font-size:24px;margin:36px 0 14px}
.Hero_main__iu7yh h3{font-size:19px;margin:28px 0 10px}
.Hero_main__iu7yh p{margin-bottom:18px;font-size:17px}
.Hero_main__iu7yh ul,.Hero_main__iu7yh ol{margin:0 0 18px 28px}
.Hero_main__iu7yh a{color:#e74c3c}
.Hero_main__iu7yh img{max-width:100%;height:auto;border-radius:4px;margin:20px 0}
.Post_inner__D2jB5{border-top:2px solid #ddd;padding:28px 0;margin-top:48px;text-align:center;font-size:13px;color:#888}
.Post_inner__D2jB5 a{color:#888}
.Container_row__c969k{border-top:1px solid #ccc;border-bottom:1px solid #ccc;padding:14px 0;margin-bottom:28px;font-size:14px;color:#888;font-style:italic;text-align:center}
.Article_area__ZEnHD{background:#f9f3e3;padding:16px 20px;margin-top:28px;font-size:13px;color:#7a6230;border-radius:4px}
.Header_text__9D4Dh{font-size:11px;color:#888;margin:-22px 0 28px;text-transform:uppercase;letter-spacing:1.5px}
.Post_content__tVJuO{margin:0 0 28px}
.Wrapper_title__th222{width:100%;height:auto;border-radius:4px}
.Post_row__ZLLUf{border-top:2px solid #ddd;margin-top:40px;padding-top:24px}
.Post_row__ZLLUf h4{font-size:16px;text-transform:uppercase;letter-spacing:1px;margin-bottom:16px;color:#888}
.mag-related-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.mag-related-item a{color:#2c3e50;text-decoration:none;font-size:15px}
.mag-related-item a:hover{color:#e74c3c}
.Hero_root__HvthA{background:#fff;border-radius:4px;box-shadow:0 2px 12px rgba(0,0,0,.08);padding:22px 28px;margin-top:28px}
.Hero_root__HvthA p{font-size:15px;padding:4px 0;margin:0}
.Hero_root__HvthA .Nav_title__iODDu{margin:0 8px 0 0;display:inline}
.Hero_root__HvthA a{color:#2c3e50;text-decoration:none}
.Hero_root__HvthA a:hover{color:#e74c3c}
/* === Theme === */
@import url('https://fonts.googleapis.com/css2?family=Lora:wght@400;500;600;700&family=Cinzel:wght@400;700&display=swap');
body{font-family:'Lora',sans-serif;color:#1A1A1A;background:#FDFBF7}
.Footer_text__zyXY6{background:#2D1B4E;color:#fff}
.Footer_text__zyXY6 h1{font-family:'Cinzel',serif;color:#fff}
.Footer_text__zyXY6 p{color:rgba(255,255,255,.75)}
.Footer_text__zyXY6 a{color:#fff;text-decoration:none}
.card h2{font-family:'Cinzel',serif}
.card h2 a{color:#2D1B4E}
.card h2 a:hover{color:#D4AF37}
.read-more{color:#D4AF37}
.article-content h1{font-family:'Cinzel',serif}
.article-content h2{font-family:'Cinzel',serif}
.article-content a{color:#D4AF37}
.article-content img{border-radius:8px}
.affiliate-disclosure{border-radius:8px}
.ymyl-disclaimer{border-radius:8px}
/* === Custom === */
/* tr-tarot-es — magazine template
   Beatriz Mondragon: translator, four-year Tarot de Marsella practice, reviews Hotmart/Udemy courses
   Palette: ink-charcoal #2A2420 (archive ledger) + oxblood #A63D2E (red-pen edit) on parchment #F7F1E4 */

@import url('https://fonts.googleapis.com/css2?family=Crimson+Pro:ital,wght@0,400;0,500;0,600;0,700;1,400&family=Public+Sans:wght@400;500;600;700&display=swap');

/* ─── Design tokens ─── */
:root {
  --color-primary:        #2A2420;
  --color-primary-dark:   #16120F;
  --color-primary-light:  #E8E1D3;
  --color-accent:         #A63D2E;
  --color-accent-dark:    #7C2D21;
  --color-accent-light:   #F0D9CE;
  --color-bg:             #F7F1E4;
  --color-bg-alt:         #EFE6D2;
  --color-surface:        #FFFBF2;
  --color-text:           #241F1B;
  --color-text-secondary: #4E453C;
  --color-text-muted:     #7A6F62;
  --color-border:         #DDD0B0;
  --color-border-light:   #EAE1CB;
  --color-highlight:      #EFE6D2;
  --color-nav-bg:         #16120F;
  --color-nav-text:       #F3ECDD;
  --color-link:           #7C2D21;
  --color-link-hover:     #A63D2E;
  --font-heading:         'Crimson Pro', Georgia, serif;
  --font-body:            'Public Sans', system-ui, sans-serif;
  --font-size-base:       17px;
  --font-size-sm:         15px;
  --font-size-lg:         19px;
  --font-size-xl:         22px;
  --font-size-2xl:        28px;
  --font-size-3xl:        36px;
  --lh-body:              1.7;
  --lh-heading:           1.22;
  --radius:               4px;
  --sp:                   8px;
  --max-prose:            68ch;
  --max-content:          1180px;
}

*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

html {
  font-size: var(--font-size-base);
  -webkit-text-size-adjust: 100%;
  scroll-behavior: smooth;
}

body {
  font-family: var(--font-body);
  font-size: var(--font-size-base);
  line-height: var(--lh-body);
  color: var(--color-text);
  background-color: var(--color-bg);
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

/* ─── Headings ─── */
:root h1, :root h2, :root h3, :root h4, :root h5, :root h6 {
  font-family: var(--font-heading);
  font-weight: 700;
  line-height: var(--lh-heading);
  color: var(--color-primary);
  letter-spacing: -0.005em;
}

:root h1 { font-size: clamp(1.7rem, 4vw, 2.35rem);   margin-bottom: calc(var(--sp) * 2); font-weight: 700; }
:root h2 { font-size: clamp(1.3rem, 3vw, 1.8rem);    margin-top: calc(var(--sp) * 4); margin-bottom: calc(var(--sp) * 1.5); }
:root h3 { font-size: clamp(1.1rem, 2.5vw, 1.4rem);  margin-top: calc(var(--sp) * 3); margin-bottom: var(--sp); font-weight: 600; }
:root h4 { font-size: 1.1rem; font-weight: 600;      margin-top: calc(var(--sp) * 2); margin-bottom: var(--sp); }

/* ─── Body text ─── */
:root p {
  max-width: var(--max-prose);
  margin-bottom: calc(var(--sp) * 2);
  color: var(--color-text);
}

:root a {
  color: var(--color-link);
  text-decoration-color: color-mix(in srgb, var(--color-link) 45%, transparent);
  text-underline-offset: 3px;
  transition: color 0.15s ease, text-decoration-color 0.15s ease;
}
:root a:hover {
  color: var(--color-link-hover);
  text-decoration-color: var(--color-link-hover);
}

/* ─── Lists ─── */
:root ul, :root ol {
  max-width: var(--max-prose);
  padding-left: calc(var(--sp) * 3);
  margin-bottom: calc(var(--sp) * 2);
}
:root li                { margin-bottom: calc(var(--sp) * 0.75); line-height: var(--lh-body); }
:root ul li::marker     { color: var(--color-accent); }
:root ol li::marker     { color: var(--color-primary); font-weight: 700; font-family: var(--font-heading); }
:root li ul, :root li ol { margin-top: var(--sp); margin-bottom: 0; }

/* ─── Blockquote ─── */
:root blockquote {
  max-width: var(--max-prose);
  margin: calc(var(--sp) * 3) 0;
  padding: calc(var(--sp) * 2) calc(var(--sp) * 3);
  border-left: 3px solid var(--color-accent);
  background-color: var(--color-highlight);
  border-radius: 0 var(--radius) var(--radius) 0;
  font-style: italic;
  color: var(--color-text-secondary);
}
:root blockquote p      { margin-bottom: 0; }
:root blockquote strong { color: var(--color-primary); font-style: normal; }
:root blockquote cite {
  display: block;
  margin-top: var(--sp);
  font-size: var(--font-size-sm);
  font-style: normal;
  color: var(--color-text-muted);
}

/* ─── Media ─── */
:root img { max-width: 100%; height: auto; border-radius: var(--radius); display: block; }
:root hr  { border: none; border-top: 1px solid var(--color-border); margin: calc(var(--sp) * 4) 0; }

/* ─── Magazine header ─── */
:root .Footer_text__zyXY6 {
  background-color: var(--color-nav-bg);
  color: var(--color-nav-text);
  padding: calc(var(--sp) * 3) calc(var(--sp) * 2);
}
:root .Footer_text__zyXY6 a       { color: var(--color-nav-text); text-decoration: none; }
:root .Footer_text__zyXY6 a:hover { color: var(--color-accent-light); }
:root .Footer_text__zyXY6 .site-title {
  font-family: var(--font-heading);
  font-size: clamp(1.5rem, 4vw, 2.15rem);
  font-weight: 700;
  letter-spacing: 0.01em;
  color: var(--color-nav-text);
}
:root .Footer_text__zyXY6 .site-tagline {
  font-size: var(--font-size-sm);
  font-style: italic;
  font-family: var(--font-heading);
  color: color-mix(in srgb, var(--color-nav-text) 62%, transparent);
  margin-top: calc(var(--sp) * 0.5);
}

/* ─── Navigation ─── */
:root .mag-nav { background-color: var(--color-primary); }
:root .mag-nav ul {
  list-style: none;
  display: flex;
  flex-wrap: wrap;
  max-width: var(--max-content);
  margin-inline: auto;
  padding-inline: calc(var(--sp) * 2);
}
:root .mag-nav li         { margin: 0; }
:root .mag-nav li::marker { color: transparent; }
:root .mag-nav a {
  display: block;
  padding: calc(var(--sp) * 1.25) calc(var(--sp) * 2);
  color: rgba(243, 236, 221, 0.85);
  text-decoration: none;
  font-family: var(--font-body);
  font-size: var(--font-size-sm);
  font-weight: 600;
  letter-spacing: 0.04em;
}
:root .mag-nav a:hover {
  color: #fff;
  background-color: rgba(255, 255, 255, 0.08);
}

/* ─── Layout ─── */
:root .mag-container { max-width: var(--max-content); margin-inline: auto; padding-inline: calc(var(--sp) * 2); }
:root .mag-main       { padding-block: calc(var(--sp) * 5); }

/* ─── Cards ─── */
:root .card {
  background-color: var(--color-surface);
  border: 1px solid var(--color-border);
  border-radius: var(--radius);
  overflow: hidden;
  display: flex;
  flex-direction: column;
  min-height: 280px;
  transition: box-shadow 0.2s ease, border-color 0.2s ease;
}
:root .card:hover {
  box-shadow: 0 4px 18px rgba(42, 36, 32, 0.1);
  border-color: color-mix(in srgb, var(--color-border) 45%, var(--color-primary));
}
:root .card h2         { font-size: 1.2rem; margin: 0 0 var(--sp); font-weight: 700; }
:root .card h2 a       { color: var(--color-primary); text-decoration: none; }
:root .card h2 a:hover { color: var(--color-accent); }
:root .card-body       { padding: calc(var(--sp) * 2.5); flex: 1; display: flex; flex-direction: column; }
:root .card-meta       { font-size: var(--font-size-sm); font-family: var(--font-body); color: var(--color-text-muted); margin-bottom: var(--sp); letter-spacing: 0.02em; }
:root .card-excerpt    { font-size: var(--font-size-sm); line-height: 1.6; max-width: 100%; margin-bottom: 0; }

/* ─── Read more link ─── */
:root .read-more {
  display: block;
  margin-top: auto;
  padding-top: calc(var(--sp) * 1.5);
  font-family: var(--font-body);
  font-size: var(--font-size-sm);
  font-weight: 600;
  letter-spacing: 0.02em;
  color: var(--color-accent);
  text-decoration: none;
}
:root .read-more:hover { color: var(--color-accent-dark); text-decoration: underline; }

/* ─── Article content ─── */
:root .article-content         { max-width: var(--max-prose); }
:root .article-content h2      { border-bottom: 1px solid var(--color-border); padding-bottom: calc(var(--sp) * 0.75); }
:root .article-content a       { color: var(--color-link); }
:root .article-content a:hover { color: var(--color-link-hover); }
:root .article-content img     { border-radius: var(--radius); }
:root .article-content > p:first-child {
  font-size: 1.05rem;
  color: var(--color-text-secondary);
  line-height: 1.78;
}
:root .article-meta {
  font-family: var(--font-body);
  font-size: var(--font-size-sm);
  color: var(--color-text-muted);
  margin-bottom: calc(var(--sp) * 4);
  padding-bottom: calc(var(--sp) * 2);
  border-bottom: 1px solid var(--color-border);
  letter-spacing: 0.02em;
}
:root .article-meta .author { font-weight: 700; color: var(--color-primary); }

/* ─── Tags ─── */
:root .tag {
  display: inline-block;
  padding: calc(var(--sp) * 0.5) calc(var(--sp) * 1.25);
  background-color: var(--color-primary-light);
  color: var(--color-primary);
  border-radius: var(--radius);
  font-family: var(--font-body);
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  text-decoration: none;
}
:root .tag:hover { background-color: var(--color-primary); color: #fff; text-decoration: none; }

/* ─── Footer ─── */
:root .Post_inner__D2jB5 {
  background-color: var(--color-nav-bg);
  color: color-mix(in srgb, var(--color-nav-text) 65%, transparent);
  padding: calc(var(--sp) * 5) calc(var(--sp) * 2);
  font-family: var(--font-body);
  font-size: var(--font-size-sm);
  margin-top: calc(var(--sp) * 6);
}
:root .Post_inner__D2jB5 a       { color: color-mix(in srgb, var(--color-nav-text) 75%, transparent); text-decoration: none; }
:root .Post_inner__D2jB5 a:hover { color: var(--color-accent-light); text-decoration: underline; }

/* ─── Responsive ─── */
@media (max-width: 680px) {
  :root             { --font-size-base: 16px; }
  :root .Footer_text__zyXY6 { padding: calc(var(--sp) * 2) var(--sp); }
  :root .mag-main   { padding-block: calc(var(--sp) * 3); }
  :root .card-body  { padding: calc(var(--sp) * 2); }
}

/* === R2 fixes (2026-07-10T13:40:30.269217+00:00) === */

/* Fix 1: on the homepage the site title/tagline are the real h1/p, nested
   inside <nav><div><h1>/<p>, so they inherited the global ink-charcoal
   ":root h1" color onto the dark nav background — unreadable. */
:root body > nav h1,
:root body > nav p {
  color: var(--color-nav-text);
}

/* Fix 2: homepage listing cards (each a div.Page_box__2O6t7 with a date p,
   an h2 > a title, an unclassed excerpt p, and a "Continue Reading" a)
   sit outside the .card/.read-more scope this file defines and fall back
   to a generic slate blue. Match the warm palette already used in articles. */
:root .Page_box__2O6t7 h2 a {
  color: var(--color-primary);
}
:root .Page_box__2O6t7 h2 a:hover {
  color: var(--color-accent);
}
:root .Page_box__2O6t7 h2 + p {
  color: var(--color-text);
}
:root .Page_box__2O6t7 a.Hero_area__O2HpQ {
  color: var(--color-accent);
}
:root .Page_box__2O6t7 a.Hero_area__O2HpQ:hover {
  color: var(--color-accent-dark);
}

/* Fix 3: affiliate course links get a quiet underline-free border instead
   of sharing the same underline as internal/reference links, so a paying
   link reads apart from a free one without icons or boxes. */
:root a[href^="/pick/"] {
  border-bottom: 1px solid var(--color-accent);
  text-decoration: none;
}
:root a[href^="/pick/"]:hover {
  border-bottom-color: var(--color-accent-dark);
}

/* Fix 4: homepage card date (p.Nav_title__iODDu) rendered a cold neutral
   grey outside the site palette. */
:root p.Nav_title__iODDu {
  color: var(--color-text-muted);
}

/* === R3 fixes (2026-07-10T14:40:21.037718+00:00) === */

/* Fix 1: affiliate course links (a[href^="/pick/"]) shared the same font
   weight as body text and reference links, so at a quick glance both read
   as "the same family of red." Bumping weight makes the paid link register
   before the reader even isolates the exact color/underline treatment. */
:root a[href^="/pick/"] {
  font-weight: 600;
}
