/* AllFit Installations — SDS tokens */
:root {
  /* Ivory-heavy palette (default) */
  --bg-default: #FAF7F1;
  --bg-section: #F2EBDE;
  --bg-section-deep: #ECE3D2;
  --bg-card: #FFFFFF;
  --bg-inverse: #1F1F1D;

  --text-primary: #1F1F1D;
  --text-secondary: #3A3833;
  --text-muted: #6B665C;
  --text-inverse: #FAF7F1;

  --brand-primary: #5A3A25;     /* walnut */
  --brand-primary-soft: #7A5538;
  --brand-secondary: #61705A;   /* sage */
  --brand-accent: #B8895B;      /* timber */
  --whatsapp: #25D366;
  --whatsapp-deep: #128C7E;

  --border-default: #E7DED1;
  --border-strong: #DDD5C8;
  --border-card: #ECE3D2;

  --shadow-card: 0 1px 2px rgba(31,31,29,0.04), 0 4px 16px rgba(90,58,37,0.06);
  --shadow-image: 0 12px 32px rgba(31,31,29,0.10), 0 2px 8px rgba(31,31,29,0.04);
  --shadow-cta-bar: 0 -1px 0 rgba(0,0,0,0.04), 0 -8px 24px rgba(31,31,29,0.06);
  --shadow-trust: 0 18px 36px rgba(90,58,37,0.16);

  /* radii */
  --r-card: 24px;
  --r-image: 28px;
  --r-input: 14px;
  --r-pill: 999px;

  /* type */
  --f-head: 'Manrope', 'Inter', system-ui, sans-serif;
  --f-body: 'Inter', system-ui, sans-serif;
}

/* ── Palettes ─────────────────────────────────────────────── */

/* ivory (default — no override needed) */

/* walnut: dark timber */
[data-palette="walnut"] {
  --bg-default:      #1F1714;
  --bg-section:      #2A2018;
  --bg-section-deep: #160F0B;
  --bg-card:         #2A2018;
  --bg-inverse:      #FAF7F1;
  --text-primary:    #F4E8D8;
  --text-secondary:  #D9C9B0;
  --text-muted:      #A89880;
  --text-inverse:    #1F1714;
  --border-default:  #3A2A1E;
  --border-strong:   #4A3828;
  --border-card:     #3A2A1E;
  --brand-primary:   #C89A6B;
  --brand-secondary: #7A9A72;
  --brand-accent:    #E8C090;
}

/* slate: cool stone grey */
[data-palette="slate"] {
  --bg-default:      #F4F5F7;
  --bg-section:      #EAECEF;
  --bg-section-deep: #E2E5E9;
  --bg-card:         #FFFFFF;
  --bg-inverse:      #1A2433;
  --text-primary:    #1A2433;
  --text-secondary:  #374151;
  --text-muted:      #6B7280;
  --text-inverse:    #F4F5F7;
  --border-default:  #D1D5DB;
  --border-strong:   #C4C9D0;
  --border-card:     #E2E5E9;
  --brand-primary:   #4A6FA5;
  --brand-secondary: #6B7280;
  --brand-accent:    #7BA3CC;
  --shadow-card: 0 1px 2px rgba(26,36,51,0.04), 0 4px 16px rgba(74,111,165,0.06);
}

/* sage: forest green */
[data-palette="sage"] {
  --bg-default:      #F2F5F1;
  --bg-section:      #E8EDE6;
  --bg-section-deep: #DDE4DA;
  --bg-card:         #FFFFFF;
  --bg-inverse:      #1A2B1E;
  --text-primary:    #1A2B1E;
  --text-secondary:  #2D4034;
  --text-muted:      #5A6E5C;
  --text-inverse:    #F2F5F1;
  --border-default:  #C8D8C4;
  --border-strong:   #BACAB6;
  --border-card:     #D8E4D4;
  --brand-primary:   #3D5A45;
  --brand-secondary: #5A7A60;
  --brand-accent:    #8AB896;
  --shadow-card: 0 1px 2px rgba(26,43,30,0.04), 0 4px 16px rgba(61,90,69,0.06);
}

/* midnight: deep navy */
[data-palette="midnight"] {
  --bg-default:      #0F1219;
  --bg-section:      #161C26;
  --bg-section-deep: #1C2333;
  --bg-card:         #1F2535;
  --bg-inverse:      #E8E6E1;
  --text-primary:    #E8E6E1;
  --text-secondary:  #C4C0BA;
  --text-muted:      #8A8680;
  --text-inverse:    #0F1219;
  --border-default:  #2A3040;
  --border-strong:   #323848;
  --border-card:     #2A3040;
  --brand-primary:   #D4A85C;
  --brand-secondary: #5A7A8A;
  --brand-accent:    #E8C984;
  --shadow-card: 0 1px 2px rgba(0,0,0,0.15), 0 4px 16px rgba(0,0,0,0.2);
  --shadow-trust: 0 18px 36px rgba(0,0,0,0.35);
}

/* blush: dusty rose */
[data-palette="blush"] {
  --bg-default:      #FEF1F0;
  --bg-section:      #FAE4E2;
  --bg-section-deep: #F5D4D1;
  --bg-card:         #FFFFFF;
  --bg-inverse:      #2E1614;
  --text-primary:    #2E1614;
  --text-secondary:  #4A2826;
  --text-muted:      #8A5E5C;
  --text-inverse:    #FEF1F0;
  --border-default:  #EDD0CE;
  --border-strong:   #E4C0BE;
  --border-card:     #F2DAD8;
  --brand-primary:   #9E3D3A;
  --brand-secondary: #B86E6B;
  --brand-accent:    #CC9590;
  --shadow-card: 0 1px 2px rgba(46,22,20,0.04), 0 4px 16px rgba(158,61,58,0.08);
  --shadow-trust: 0 18px 36px rgba(158,61,58,0.18);
}

/* sky: powder blue */
[data-palette="sky"] {
  --bg-default:      #EFF6FB;
  --bg-section:      #E2EEF7;
  --bg-section-deep: #D4E6F2;
  --bg-card:         #FFFFFF;
  --bg-inverse:      #132233;
  --text-primary:    #132233;
  --text-secondary:  #243A4E;
  --text-muted:      #557080;
  --text-inverse:    #EFF6FB;
  --border-default:  #C4DCEA;
  --border-strong:   #B0CEE0;
  --border-card:     #D4E8F2;
  --brand-primary:   #1E6090;
  --brand-secondary: #3A80A8;
  --brand-accent:    #5AA8CC;
  --shadow-card: 0 1px 2px rgba(19,34,51,0.04), 0 4px 16px rgba(30,96,144,0.08);
  --shadow-trust: 0 18px 36px rgba(30,96,144,0.16);
}

/* butter: warm lemon */
[data-palette="butter"] {
  --bg-default:      #FDFBEE;
  --bg-section:      #F8F3D8;
  --bg-section-deep: #F2ECC4;
  --bg-card:         #FFFFFF;
  --bg-inverse:      #28220A;
  --text-primary:    #28220A;
  --text-secondary:  #403818;
  --text-muted:      #786830;
  --text-inverse:    #FDFBEE;
  --border-default:  #E8DEAA;
  --border-strong:   #DDD292;
  --border-card:     #EEE8C0;
  --brand-primary:   #7A6818;
  --brand-secondary: #9A8830;
  --brand-accent:    #C0A840;
  --shadow-card: 0 1px 2px rgba(40,34,10,0.04), 0 4px 16px rgba(122,104,24,0.08);
  --shadow-trust: 0 18px 36px rgba(122,104,24,0.18);
}

/* lilac: muted lavender */
[data-palette="lilac"] {
  --bg-default:      #F5F0FA;
  --bg-section:      #EDE5F6;
  --bg-section-deep: #E3D8EE;
  --bg-card:         #FFFFFF;
  --bg-inverse:      #1E1428;
  --text-primary:    #1E1428;
  --text-secondary:  #342244;
  --text-muted:      #705888;
  --text-inverse:    #F5F0FA;
  --border-default:  #D5C4E4;
  --border-strong:   #C8B4DA;
  --border-card:     #E0D2EE;
  --brand-primary:   #5A3880;
  --brand-secondary: #7858A0;
  --brand-accent:    #9E80C0;
  --shadow-card: 0 1px 2px rgba(30,20,40,0.04), 0 4px 16px rgba(90,56,128,0.08);
  --shadow-trust: 0 18px 36px rgba(90,56,128,0.18);
}

/* chalk: crisp minimal */
[data-palette="chalk"] {
  --bg-default:      #FFFFFF;
  --bg-section:      #F8F8F8;
  --bg-section-deep: #F0F0F0;
  --bg-card:         #FFFFFF;
  --bg-inverse:      #1A1A1A;
  --text-primary:    #1A1A1A;
  --text-secondary:  #333333;
  --text-muted:      #777777;
  --text-inverse:    #FFFFFF;
  --border-default:  #E8E8E8;
  --border-strong:   #DCDCDC;
  --border-card:     #EBEBEB;
  --brand-primary:   #1A1A1A;
  --brand-secondary: #555555;
  --brand-accent:    #888888;
  --shadow-card: 0 1px 2px rgba(0,0,0,0.04), 0 4px 16px rgba(0,0,0,0.06);
}

/* legacy intensity override — kept for backward compat */
[data-intensity="walnut"] {
  --bg-default: #1F1714; --bg-section: #2A2018; --bg-section-deep: #160F0B;
}

* { box-sizing: border-box; }

.allfit, .forma {
  font-family: var(--f-body);
  background: var(--bg-default);
  color: var(--text-primary);
  -webkit-font-smoothing: antialiased;
  font-feature-settings: 'ss01' on, 'cv11' on;
  letter-spacing: -0.005em;
  line-height: 1.5;
}

.allfit h1, .allfit h2, .allfit h3, .allfit h4,
.forma h1, .forma h2, .forma h3, .forma h4 {
  font-family: var(--f-head);
  font-weight: 700;
  letter-spacing: -0.025em;
  line-height: 1.08;
  margin: 0;
  color: var(--text-primary);
  text-wrap: balance;
}

.allfit p, .forma p { margin: 0; text-wrap: pretty; }


.logo {
  font-family: "Inter", sans-serif;
  font-style: normal;
  font-weight: 700;
  font-size: 24px;
  letter-spacing: -0.04em;
  line-height: 1em;
  text-align: left;
  text-decoration: none;
  white-space: nowrap;
  width: auto;
  height: auto;
  transition: color 1.2s cubic-bezier(0.23, 1, 0.32, 1);
}

.logo--dark {
  color: rgb(20, 20, 20);
}

.logo--light {
  color: #fff;
}

.logo-display {
  font-family: "Inter Display", "Inter", sans-serif;
  font-style: normal;
  font-weight: 600;
  letter-spacing: -0.06em;
  line-height: 1;
}

@media (min-width: 1024px) {
  .logo-display { font-size: 190px; }
}

@media (min-width: 768px) and (max-width: 1023px) {
  .logo-display { font-size: 90px; }
}

@media (max-width: 767px) {
  .logo-display { font-size: 51px; }
}

/* Buttons */
.btn {
  display: inline-flex; align-items: center; justify-content: center;
  gap: 8px; padding: 14px 20px;
  border-radius: var(--r-pill);
  font-family: var(--f-head); font-weight: 600; font-size: 15px;
  border: none; cursor: pointer; text-decoration: none;
  letter-spacing: -0.01em;
  transition: transform .12s ease, box-shadow .12s ease, background .15s;
}
.btn:active { transform: scale(0.98); }

.btn-wa {
  background: var(--whatsapp); color: #fff;
  box-shadow: 0 1px 0 rgba(0,0,0,0.04), 0 6px 14px rgba(18,140,126,0.25);
}
.btn-wa:hover { background: var(--whatsapp-deep); }

.btn-primary {
  background: var(--brand-primary); color: #fff;
  box-shadow: 0 1px 0 rgba(0,0,0,0.04), 0 6px 14px color-mix(in srgb, var(--brand-primary) 28%, transparent);
}
.btn-secondary {
  background: var(--bg-card); color: var(--text-primary);
  border: 1px solid var(--border-strong);
}
.btn-ghost {
  background: transparent; color: var(--text-primary);
  border: 1px solid var(--border-strong);
}

/* Section base */
.section { padding: 56px 20px; }
.section-tight { padding: 40px 20px; }
.eyebrow {
  font-family: var(--f-head);
  font-size: 12px; font-weight: 600;
  letter-spacing: 0.12em; text-transform: uppercase;
  color: var(--brand-primary);
  display: inline-flex; align-items: center; gap: 8px;
}
.eyebrow::before {
  content: ''; width: 18px; height: 1.5px; background: var(--brand-accent);
}

/* Card */
.card {
  background: var(--bg-card);
  border: 1px solid var(--border-card);
  border-radius: var(--r-card);
  box-shadow: var(--shadow-card);
}

/* Placeholder photo block */
.ph {
  position: relative; overflow: hidden;
  background:
    repeating-linear-gradient(135deg,
      #E0D2B8 0 1px, transparent 1px 14px),
    linear-gradient(180deg, #DCC9A8 0%, #C9B488 100%);
  color: rgba(31,31,29,0.55);
  display: flex; align-items: flex-end; justify-content: flex-start;
  padding: 14px;
  border-radius: var(--r-image);
  border: 1px solid rgba(90,58,37,0.10);
}
.ph-label {
  font-family: 'JetBrains Mono', ui-monospace, Menlo, monospace;
  font-size: 11px; font-weight: 500;
  background: rgba(255,255,255,0.85);
  color: var(--brand-primary);
  padding: 4px 8px; border-radius: 999px;
  letter-spacing: 0.02em;
}
.ph-walnut {
  background:
    repeating-linear-gradient(118deg,
      rgba(90,58,37,0.15) 0 2px, transparent 2px 22px),
    linear-gradient(170deg, #8C6240 0%, #5A3A25 100%);
  color: #FAF7F1;
}
.ph-walnut .ph-label {
  background: rgba(31,18,10,0.55);
  color: #F4E6D0;
  backdrop-filter: blur(4px);
}
.ph-sage {
  background:
    repeating-linear-gradient(135deg,
      rgba(255,255,255,0.18) 0 1px, transparent 1px 16px),
    linear-gradient(180deg, #8A9881 0%, #61705A 100%);
  color: #fff;
}
.ph-sage .ph-label { background: rgba(31,31,29,0.5); color: #fff; }

/* Trust badge */
.badge {
  display: inline-flex; align-items: center; gap: 6px;
  padding: 6px 12px;
  border-radius: 999px;
  background: color-mix(in srgb, var(--brand-accent) 12%, transparent);
  color: var(--brand-primary);
  font-family: var(--f-head); font-weight: 600;
  font-size: 12px; letter-spacing: -0.005em;
  border: 1px solid color-mix(in srgb, var(--brand-accent) 20%, transparent);
}
.badge-dot { width: 6px; height: 6px; border-radius: 50%; background: var(--brand-accent); }

/* Star icon used inline */
.stars { display: inline-flex; gap: 1px; color: var(--brand-accent); }

/* Inputs */
.input, .textarea, .select {
  width: 100%;
  background: var(--bg-card);
  border: 1px solid var(--border-strong);
  border-radius: var(--r-input);
  padding: 13px 14px;
  font-family: var(--f-body); font-size: 15px;
  color: var(--text-primary);
  transition: border-color .15s, box-shadow .15s;
}
.input:focus, .textarea:focus, .select:focus {
  outline: none; border-color: var(--brand-primary);
  box-shadow: 0 0 0 3px rgba(90,58,37,0.10);
}
.label {
  display: block;
  font-family: var(--f-head); font-weight: 600;
  font-size: 13px; color: var(--text-secondary);
  margin-bottom: 6px;
  letter-spacing: -0.005em;
}

/* Animations */
@keyframes pulse {
  0%, 100% { opacity: 0.4; transform: scale(1); }
  50% { opacity: 0.9; transform: scale(1.1); }
}
.live-dot {
  width: 8px; height: 8px; border-radius: 50%;
  background: var(--whatsapp);
  box-shadow: 0 0 0 0 rgba(37,211,102,0.5);
  animation: pulse 2s infinite;
}

/* Divider */
.divider {
  height: 1px; background: var(--border-default);
  border: none; margin: 0;
}

/* Scrollbar hidden but scrollable */
.allfit::-webkit-scrollbar, .forma::-webkit-scrollbar { width: 0; }
