/* ============================================================
   ReIntegraMente — Design Tokens & Component Library
   Fonte canônica: DESIGN.md (mesma pasta). Light-first lavanda.
   Tier 1 primitives → Tier 2 semantic → dark → base → layout → components.
   ============================================================ */

:root {
  /* ---- Tier 1 · Primitives · Cor ---- */
  --plum:#602C7F; --plum-deep:#241430; --plum-soft:#34234A;
  --amethyst:#8963A8; --amethyst-bright:#B79AD0; --amethyst-deep:#6D5194;
  --lilac:#C6B8DB; --lilac-soft:#DDD2E8; --lavender:#E6DDF3; --lavender-pale:#F4F0F7;
  --sage:#8FA37A; --sage-deep:#556B47; --sage-pale:#D7DECB;
  --orchid:#B068A6;
  --ink:#2A1B3D; --ink-soft:#4A3A5E; --ink-muted:#7A6E8C;
  --paper-warm:#F7F2FA; --muted-lilac:#EAE2F2; --white:#FFFFFF; --near-white:#FCFAFE;

  /* Fonts */
  --font-display:'Cormorant','Cormorant Garamond',Georgia,'Times New Roman',serif;
  --font-body:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',system-ui,sans-serif;

  /* Type scale (modular 1.25 · base 16px) */
  --text-2xs:.625rem; --text-xs:.75rem; --text-sm:.875rem; --text-base:1rem;
  --text-md:1.1875rem; --text-lg:1.625rem; --text-xl:2.25rem; --text-2xl:3rem;
  --text-3xl:3.75rem; --text-display:5.5rem;
  --leading-tight:1.1; --leading-snug:1.2; --leading-normal:1.5; --leading-relaxed:1.7;
  --tracking-eyebrow:.22em; --tracking-wide:.02em;

  /* ---- Spacing · 4px base / 8pt grid ---- */
  --space-0:0; --space-1:4px; --space-2:8px; --space-3:12px; --space-4:16px;
  --space-5:20px; --space-6:24px; --space-8:32px; --space-10:40px; --space-12:48px;
  --space-14:56px; --space-16:64px; --space-20:80px; --space-24:96px; --space-28:112px; --space-32:128px;
  /* Semantic spacing roles */
  --gap-inline:12px;        /* between inline siblings (icon+label) */
  --gap-stack:16px;         /* default vertical rhythm */
  --gap-stack-lg:24px;      /* between blocks */
  --pad-card:32px;          /* card inset */
  --pad-button:14px 28px;   /* button inset */
  --pad-input:14px 16px;    /* input inset */
  --pad-section:112px;      /* vertical section rhythm (desktop) */
  --pad-section-mobile:56px;
  --margin-site:72px; --gutter:24px; --container-max:1200px; --reading:66ch;

  /* Radii */
  --radius-sm:6px; --radius-button:10px; --radius-input:10px;
  --radius-card:18px; --radius-xl:24px; --radius-2xl:32px; --radius-pill:9999px;

  /* Shadows (plum-tinted, soft) */
  --shadow-sm:0 1px 2px rgba(96,44,127,.06);
  --shadow-md:0 8px 24px rgba(96,44,127,.10);
  --shadow-lg:0 2px 6px rgba(96,44,127,.05),0 18px 44px rgba(96,44,127,.12);
  --shadow-xl:0 4px 10px rgba(96,44,127,.06),0 28px 64px rgba(96,44,127,.16);
  --shadow-amethyst:0 2px 8px rgba(96,44,127,.08),0 14px 36px rgba(137,99,168,.22);
  --focus-ring:0 0 0 3px rgba(137,99,168,.40);

  /* Motion */
  --duration-fast:220ms; --duration-base:320ms; --duration-bloom:700ms;
  --ease-soft:cubic-bezier(.33,0,.2,1);

  /* Breakpoints (reference) — sm480 md768 lg1024 xl1280 */

  /* ---- Tier 2 · Semantic (light baseline) ---- */
  --background:var(--lavender-pale); --foreground:var(--ink);
  --surface:var(--near-white); --card:var(--white); --card-foreground:var(--ink);
  --muted:var(--muted-lilac); --muted-foreground:var(--ink-muted);
  --primary:var(--plum); --primary-foreground:var(--near-white); --primary-hover:var(--amethyst-deep);
  --secondary:var(--amethyst); --secondary-foreground:var(--white); --secondary-hover:#7A559A;
  --accent:var(--amethyst); --accent-botanical:var(--sage);
  --border:var(--lilac-soft); --border-subtle:var(--muted-lilac); --border-strong:var(--lilac);
  --input:var(--white); --ring:rgba(137,99,168,.40);
  --text-accent:var(--plum); --text-botanical:var(--sage-deep); --heading-italic:var(--amethyst);
  --link:var(--plum); --link-hover:var(--amethyst);
  /* feedback (kept in family) */
  --success:#5E8C6A; --success-bg:#E7F0E9; --warning:#C58A3D; --warning-bg:#F6ECDD;
  --danger:#C0476B; --danger-bg:#F6E3E9; --info:#6D5194; --info-bg:#ECE6F4;
  --disabled-bg:#EFEAF4; --disabled-fg:#B3A8C2;
}

[data-theme="dark"], .dark {
  --background:var(--plum-deep); --foreground:#F0E9F7;
  --surface:var(--plum-soft); --card:var(--plum-soft); --card-foreground:#F0E9F7;
  --muted:#1B0F26; --muted-foreground:#B7A9C9;
  --primary:var(--amethyst-bright); --primary-foreground:var(--plum-deep); --primary-hover:var(--lilac);
  --secondary:var(--sage); --secondary-foreground:var(--plum-deep); --secondary-hover:#A6BC8E;
  --accent:var(--lilac); --accent-botanical:#A6BC8E;
  --border:rgba(255,255,255,.16); --border-subtle:rgba(255,255,255,.10); --border-strong:rgba(255,255,255,.26);
  --input:var(--plum-soft); --ring:rgba(183,154,208,.40);
  --text-accent:var(--lilac); --text-botanical:#A6BC8E; --heading-italic:var(--amethyst-bright);
  --link:var(--lilac); --link-hover:var(--amethyst-bright);
  --success-bg:#243528; --warning-bg:#33291A; --danger-bg:#341E26; --info-bg:#241B33;
  --disabled-bg:#2A1B3D; --disabled-fg:#6A5C7C;
}

/* ============================================================
   Base
   ============================================================ */
*{box-sizing:border-box;}
body{background:var(--background);color:var(--foreground);font-family:var(--font-body);
  font-size:var(--text-base);line-height:var(--leading-relaxed);-webkit-font-smoothing:antialiased;}
h1,h2,h3,h4,.display{font-family:var(--font-display);font-weight:600;line-height:var(--leading-tight);
  letter-spacing:.005em;color:var(--foreground);}
.display{font-size:clamp(2.75rem,5vw + 1rem,var(--text-display));line-height:1.02;}
h1{font-size:clamp(2rem,3vw + .5rem,3rem);} h2{font-size:var(--text-xl);}
h3{font-size:var(--text-lg);} h4{font-size:var(--text-md);}
h1 em,h2 em,h3 em,.display em{color:var(--heading-italic);font-style:italic;}
p{margin:0;} a{color:var(--link);text-decoration:none;border-bottom:1px solid transparent;
  transition:color var(--duration-fast),border-color var(--duration-fast);}
a:hover{color:var(--link-hover);border-bottom-color:currentColor;}
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{
  outline:none;box-shadow:var(--focus-ring);border-radius:var(--radius-sm);}
small,.caption{font-size:var(--text-xs);color:var(--muted-foreground);}

/* Rich text */
.prose{max-width:var(--reading);}
.prose p + p{margin-top:var(--space-4);}
blockquote,.quote{border-left:3px solid var(--accent);padding:var(--space-2) 0 var(--space-2) var(--space-6);
  font-family:var(--font-display);font-style:italic;font-size:var(--text-lg);color:var(--ink-soft);}
.pull-quote{font-family:var(--font-display);font-style:italic;font-size:var(--text-xl);
  color:var(--text-accent);line-height:var(--leading-snug);max-width:24ch;}
ul.list,ol.list{margin:0;padding:0;list-style:none;display:flex;flex-direction:column;gap:var(--space-3);}
ul.list li{position:relative;padding-left:var(--space-6);}
ul.list li::before{content:"";position:absolute;left:0;top:.55em;width:11px;height:11px;
  border-radius:0 100% 0 100%;background:var(--accent-botanical);} /* sage leaf bullet */
ol.list{counter-reset:i;} ol.list li{position:relative;padding-left:var(--space-8);counter-increment:i;}
ol.list li::before{content:counter(i);position:absolute;left:0;top:0;width:24px;height:24px;border-radius:var(--radius-pill);
  background:var(--muted);color:var(--text-accent);font-size:13px;font-weight:600;display:grid;place-items:center;font-family:var(--font-body);}
hr,.divider{border:none;border-top:1px solid var(--border-subtle);margin:var(--space-8) 0;}

/* ============================================================
   Layout utilities
   ============================================================ */
.container{max-width:var(--container-max);margin:0 auto;padding:0 var(--gutter);}
.section{padding:var(--pad-section) 0;}
.stack{display:flex;flex-direction:column;gap:var(--gap-stack);}
.stack-lg{display:flex;flex-direction:column;gap:var(--gap-stack-lg);}
.cluster{display:flex;flex-wrap:wrap;align-items:center;gap:var(--gap-inline);}
.grid{display:grid;gap:var(--space-6);}
.grid-2{grid-template-columns:repeat(2,1fr);} .grid-3{grid-template-columns:repeat(3,1fr);}
.grid-auto{grid-template-columns:repeat(auto-fit,minmax(260px,1fr));}
@media(max-width:768px){.grid-2,.grid-3{grid-template-columns:1fr;}.section{padding:var(--pad-section-mobile) 0;}}

/* ============================================================
   Components
   ============================================================ */
/* Eyebrow */
.eyebrow{font-family:var(--font-body);font-size:var(--text-xs);font-weight:600;
  text-transform:uppercase;letter-spacing:var(--tracking-eyebrow);color:var(--text-accent);}
.lead{font-size:var(--text-md);font-weight:300;line-height:var(--leading-relaxed);}

/* Buttons + sizes + states */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--gap-inline);
  min-height:48px;padding:var(--pad-button);border-radius:var(--radius-button);
  font-family:var(--font-body);font-size:15px;font-weight:600;letter-spacing:var(--tracking-wide);
  border:1px solid transparent;cursor:pointer;text-decoration:none;
  transition:transform var(--duration-fast) var(--ease-soft),box-shadow var(--duration-fast) var(--ease-soft),background var(--duration-fast) var(--ease-soft);}
.btn-sm{min-height:38px;padding:9px 18px;font-size:14px;}
.btn-lg{min-height:56px;padding:18px 36px;font-size:16px;}
.btn-primary{background:var(--primary);color:var(--primary-foreground);box-shadow:var(--shadow-sm);}
.btn-primary:hover{background:var(--primary-hover);transform:translateY(-1px);box-shadow:var(--shadow-amethyst);}
.btn-secondary{background:var(--secondary);color:var(--secondary-foreground);}
.btn-secondary:hover{background:var(--secondary-hover);transform:translateY(-1px);}
.btn-outline{background:transparent;color:var(--text-accent);border-color:var(--border-strong);}
.btn-outline:hover{background:var(--muted);}
.btn-botanical{background:var(--accent-botanical);color:var(--white);}
.btn-ghost{background:transparent;color:var(--text-accent);}
.btn-ghost:hover{background:var(--muted);}
.btn:disabled,.btn[aria-disabled="true"]{background:var(--disabled-bg);color:var(--disabled-fg);
  border-color:transparent;cursor:not-allowed;box-shadow:none;transform:none;}
.btn-icon{min-height:48px;width:48px;padding:0;}

/* Badge / Tag / Chip */
.badge{display:inline-flex;align-items:center;gap:6px;padding:4px 12px;border-radius:var(--radius-pill);
  font-size:var(--text-xs);font-weight:600;letter-spacing:.01em;}
.badge-neutral{background:var(--muted);color:var(--text-accent);}
.badge-accent{background:color-mix(in srgb,var(--amethyst) 18%,transparent);color:var(--text-accent);}
.badge-botanical{background:var(--sage-pale);color:var(--sage-deep);}
.badge-outline{background:transparent;border:1px solid var(--border-strong);color:var(--text-accent);}

/* Card + variants */
.card{background:var(--card);color:var(--card-foreground);border:1px solid var(--border-subtle);
  border-radius:var(--radius-card);padding:var(--pad-card);box-shadow:var(--shadow-md);}
.card-soft{background:var(--surface);box-shadow:none;}
.card-feature{border-color:transparent;box-shadow:var(--shadow-lg);}
.card-quote{background:var(--paper-warm);border:none;}
.card-interactive{transition:transform var(--duration-base) var(--ease-soft),box-shadow var(--duration-base) var(--ease-soft);cursor:pointer;}
.card-interactive:hover{transform:translateY(-3px);box-shadow:var(--shadow-xl);}

/* Forms */
.field{display:flex;flex-direction:column;gap:var(--space-2);}
.label{font-size:var(--text-sm);font-weight:600;color:var(--foreground);}
.helper{font-size:var(--text-xs);color:var(--muted-foreground);}
.field-error .input,.field-error .select,.field-error .textarea{border-color:var(--danger);}
.error-text{font-size:var(--text-xs);color:var(--danger);}
.input,.select,.textarea{width:100%;min-height:48px;padding:var(--pad-input);
  background:var(--input);color:var(--foreground);border:1px solid var(--border);
  border-radius:var(--radius-input);font-family:var(--font-body);font-size:16px;
  transition:border-color var(--duration-fast),box-shadow var(--duration-fast);}
.textarea{min-height:120px;resize:vertical;line-height:var(--leading-relaxed);}
.input:focus-visible,.select:focus-visible,.textarea:focus-visible{border-color:var(--accent);box-shadow:var(--focus-ring);}
.input:disabled,.select:disabled,.textarea:disabled{background:var(--disabled-bg);color:var(--disabled-fg);cursor:not-allowed;}
.select{appearance:none;background-image:linear-gradient(45deg,transparent 50%,var(--ink-muted) 50%),linear-gradient(135deg,var(--ink-muted) 50%,transparent 50%);
  background-position:calc(100% - 20px) center,calc(100% - 14px) center;background-size:6px 6px,6px 6px;background-repeat:no-repeat;}
/* checkbox / radio / switch */
.check{display:inline-flex;align-items:center;gap:var(--space-3);cursor:pointer;font-size:var(--text-sm);}
.check input{appearance:none;width:20px;height:20px;border:1px solid var(--border-strong);background:var(--input);
  border-radius:6px;display:grid;place-items:center;cursor:pointer;}
.check input[type=radio]{border-radius:var(--radius-pill);}
.check input:checked{background:var(--primary);border-color:var(--primary);}
.check input:checked::after{content:"";width:8px;height:8px;border-radius:2px;background:var(--primary-foreground);}
.check input[type=radio]:checked::after{border-radius:var(--radius-pill);}
.switch{position:relative;width:44px;height:26px;border-radius:var(--radius-pill);background:var(--border-strong);cursor:pointer;transition:background var(--duration-fast);}
.switch[aria-checked=true]{background:var(--primary);}
.switch::after{content:"";position:absolute;top:3px;left:3px;width:20px;height:20px;border-radius:var(--radius-pill);background:var(--white);transition:left var(--duration-fast) var(--ease-soft);}
.switch[aria-checked=true]::after{left:21px;}

/* Alert / Callout */
.alert{display:flex;gap:var(--space-3);padding:var(--space-4) var(--space-5);border-radius:var(--radius-card);
  border:1px solid transparent;font-size:var(--text-sm);}
.alert-info{background:var(--info-bg);border-color:color-mix(in srgb,var(--info) 30%,transparent);color:var(--info);}
.alert-success{background:var(--success-bg);border-color:color-mix(in srgb,var(--success) 30%,transparent);color:var(--success);}
.alert-warning{background:var(--warning-bg);border-color:color-mix(in srgb,var(--warning) 30%,transparent);color:var(--warning);}
.alert strong{display:block;color:var(--foreground);margin-bottom:2px;}

/* Navbar */
.navbar{display:flex;align-items:center;justify-content:space-between;gap:var(--space-6);
  height:72px;padding:0 var(--space-6);background:color-mix(in srgb,var(--background) 88%,transparent);
  backdrop-filter:blur(10px);border-bottom:1px solid var(--border-subtle);}
.navbar nav{display:flex;gap:var(--space-6);}
.navbar nav a{font-size:15px;font-weight:500;color:var(--foreground);border:none;}
.navbar nav a:hover{color:var(--text-accent);}
.brandmark{font-family:var(--font-display);font-size:26px;font-weight:600;}
.brandmark .bio{color:var(--accent);} .brandmark .mente{color:var(--text-accent);}

/* Footer */
.footer{background:var(--plum-deep);color:#D9CCE8;padding:var(--space-16) var(--space-6) var(--space-8);}
.footer a{color:#D9CCE8;border:none;} .footer a:hover{color:#fff;}
.footer .cols{display:grid;grid-template-columns:2fr 1fr 1fr;gap:var(--space-10);max-width:var(--container-max);margin:0 auto;}
.footer h4{color:#fff;margin-bottom:var(--space-4);font-size:var(--text-md);}
@media(max-width:768px){.footer .cols{grid-template-columns:1fr;}}

/* Accordion / FAQ */
.accordion{border:1px solid var(--border-subtle);border-radius:var(--radius-card);overflow:hidden;background:var(--card);}
.accordion details{border-bottom:1px solid var(--border-subtle);}
.accordion details:last-child{border-bottom:none;}
.accordion summary{list-style:none;cursor:pointer;padding:var(--space-5) var(--space-6);
  font-family:var(--font-display);font-size:var(--text-md);font-weight:600;display:flex;justify-content:space-between;align-items:center;}
.accordion summary::-webkit-details-marker{display:none;}
.accordion summary::after{content:"+";color:var(--accent);font-size:24px;font-weight:300;}
.accordion details[open] summary::after{content:"–";}
.accordion details > p{padding:0 var(--space-6) var(--space-5);color:var(--muted-foreground);}

/* Tabs */
.tabs{display:flex;gap:var(--space-2);border-bottom:1px solid var(--border-subtle);}
.tabs .tab{padding:var(--space-3) var(--space-5);font-weight:600;font-size:15px;color:var(--muted-foreground);
  border-bottom:2px solid transparent;cursor:pointer;background:none;border-top:none;border-left:none;border-right:none;}
.tabs .tab[aria-selected=true]{color:var(--text-accent);border-bottom-color:var(--accent);}

/* Avatar */
.avatar{width:48px;height:48px;border-radius:var(--radius-pill);object-fit:cover;border:2px solid var(--border);}
.avatar-lg{width:72px;height:72px;}

/* Tooltip */
.tooltip{position:relative;display:inline-flex;}
.tooltip[data-tip]:hover::after{content:attr(data-tip);position:absolute;bottom:calc(100% + 8px);left:50%;transform:translateX(-50%);
  background:var(--plum-deep);color:#F0E9F7;padding:6px 12px;border-radius:var(--radius-sm);font-size:var(--text-xs);white-space:nowrap;box-shadow:var(--shadow-md);}

/* Table */
.table{width:100%;border-collapse:collapse;font-size:var(--text-sm);}
.table th,.table td{text-align:left;padding:var(--space-3) var(--space-4);border-bottom:1px solid var(--border-subtle);}
.table th{font-weight:600;color:var(--text-accent);font-size:var(--text-xs);text-transform:uppercase;letter-spacing:.08em;}
.table tbody tr:hover{background:var(--muted);}

/* CTA band */
.cta-band{background:var(--plum-deep);color:#F0E9F7;border-radius:var(--radius-xl);
  padding:var(--space-16) var(--space-12);text-align:center;}
.cta-band h2,.cta-band h3{color:#F0E9F7;} .cta-band em{color:var(--amethyst-bright);}

@media(prefers-reduced-motion:reduce){*{transition-duration:.01ms!important;animation-duration:.01ms!important;}}
