/*
 * BASE STYLES
 * Root tokens (Elementor map), global base
 *
 * Theme Name:   Aslansoy Child
 * Template:     hello-elementor
 * Author:       Aslansoy
 * Description:  Child theme for Hello Elementor.
 * Version:      1.0.0
 * Text Domain:  aslansoy
*/

/* ===============================
   1) DESIGN TOKENS (Elementor map)
   =============================== */

:root {
  /* Font families (Elementor → semantic) */
  --font-family-primary: var(--e-global-typography-primary-font-family, "Figtree");
  --font-family-secondary: var(--e-global-typography-secondary-font-family, "Sora");
  --font-family-text: var(--e-global-typography-text-font-family, "Figtree");
  --font-family-accent: var(--e-global-typography-accent-font-family, "Sora");

  /* Core weights */
  --fw-regular: var(--e-global-typography-text-font-weight, 400);
  --fw-medium: var(--e-global-typography-accent-font-weight, 500);
  --fw-semibold: var(--e-global-typography-primary-font-weight, 600);
  --fw-bold: var(--e-global-typography-secondary-font-weight, 700);

  /* COLORS (Elementor map) */
  /* PRIMARY */
  --e-global-color-primary: #001E43;
  --e-global-color-primary-bright: var(--e-global-color-46925ba, #2D5BAA);
  --e-global-color-primary-deep: var(--e-global-color-92ae389, #021530);
  --e-global-color-on-primary: var(--e-global-color-56103b2, #ECF3FB);

  /* SECONDARY */
  --e-global-color-secondary: #B69A81;
  --e-global-color-secondary-bright: var(--e-global-color-ae0d430, #C7B09D);
  --e-global-color-secondary-deep: var(--e-global-color-fff2623, #81634A);
  --e-global-color-on-secondary: var(--e-global-color-b168058, #403125);

  /* TERTIARY */
  --e-global-color-tertiary: var(--e-global-color-accent, #B5ADA5);
  --e-global-color-tertiary-bright: var(--e-global-color-e86bc80, #D6D1CA);
  --e-global-color-tertiary-deep: var(--e-global-color-3e6a7d6, #6D615A);
  --e-global-color-on-tertiary: var(--e-global-color-d9876a8, #1C1916);

  /* HIGHLIGHT */
  --e-global-color-highlight-primary: var(--e-global-color-a7785bc, #DC443C);
  --e-global-color-highlight-secondary: var(--e-global-color-8bc13c7, #D7926B);
  --e-global-color-on-highlight: var(--e-global-color-bg-body, #FFFFFF);

  /* STATES */
  --e-global-color-success: var(--e-global-color-b637d10, #4CAF50);
  --e-global-color-on-success: var(--e-global-color-70e1caa, #FFFFFF);
  --e-global-color-error: var(--e-global-color-9d4a257, #D32F2F);
  --e-global-color-on-error: var(--e-global-color-3fe6e4a, #FFFFFF);
  --e-global-color-warning: var(--e-global-color-390beb3, #E18300);
  --e-global-color-on-warning: var(--e-global-color-3c2aab8, #1A1A1A);
  --e-global-color-info: var(--e-global-color-755a688, #2196F3);
  --e-global-color-on-info: var(--e-global-color-026e57f, #FFFFFF);

  /* SURFACES */
  --e-global-color-bg-body: var(--e-global-color-ffea6c4, #FFFEFA);
  --e-global-color-bg-primary: var(--e-global-color-02b2e56, #FFFEFA);
  --e-global-color-bg-secondary: var(--e-global-color-2d6dfbb, #FAF7F1);
  --e-global-color-surface-primary: var(--e-global-color-8630774, #EEECEA);
  --e-global-color-surface-secondary: var(--e-global-color-8a86af9, #E7E5E3);

  /* BORDERS & TEXT */
  --e-global-color-border-primary: var(--e-global-color-be77bef, #A3998E);
  --e-global-color-border-secondary: var(--e-global-color-8014f41, #BAB2AA);
  --e-global-color-text-primary: var(--e-global-color-text, #090807);
  --e-global-color-text-secondary: var(--e-global-color-b20913a, #897F75);
  --e-global-color-text-link: var(--e-global-color-e34ffc4, #1E88E5);

  --color-bg: var(--e-global-color-bg-body);
  --color-text: var(--e-global-color-text-primary);
  --color-accent: var(--e-global-color-primary);
  --color-border: var(--e-global-color-border-primary);
  --color-highlight: var(--e-global-color-highlight-primary);

  /* Theme fixed colors */
  --accent-color: var(--e-global-color-highlight-secondary);

  /* TYPOGRAPHY SCALE (semantic → Elementor tokens) */
  /* Display */
  --fs-display-xxl: var(--e-global-typography-f41a02b-font-size, 3rem);
  --lh-display-xxl: var(--e-global-typography-f41a02b-line-height, 1.1);
  --fw-display-xxl: var(--e-global-typography-f41a02b-font-weight, 700);

  /* Headings */
  --fs-h-xl: var(--e-global-typography-7c4582a-font-size, 3rem);
  --lh-h-xl: var(--e-global-typography-7c4582a-line-height, 1.2);
  --fw-h-xl: var(--e-global-typography-7c4582a-font-weight, 700);

  --fs-h-l: var(--e-global-typography-d6e064b-font-size, 2.25rem);
  --lh-h-l: var(--e-global-typography-d6e064b-line-height, 1.3);
  --fw-h-l: var(--fw-semibold, 600);

  --fs-h-m: var(--e-global-typography-e69d028-font-size, 1.75rem);
  --lh-h-m: 1.3;
  /* Sabit: tutarlılık */
  --fw-h-m: var(--e-global-typography-e69d028-font-weight, 600);

  --fs-h-s: var(--e-global-typography-27a3ad3-font-size, 1.5rem);
  --lh-h-s: var(--e-global-typography-27a3ad3-line-height, 1.4);
  --fw-h-s: var(--e-global-typography-27a3ad3-font-weight, 600);

  --fs-h-xs: var(--e-global-typography-27f8826-font-size, 1.25rem);
  --lh-h-xs: var(--e-global-typography-27f8826-line-height, 1.5);
  --fw-h-xs: var(--e-global-typography-27f8826-font-weight, 500);

  /* Body & labels */
  --fs-body-l: var(--e-global-typography-aa864de-font-size, 1.125rem);
  --lh-body-l: var(--e-global-typography-aa864de-line-height, 1.6);

  --fs-body-m: var(--e-global-typography-d059757-font-size, 1rem);
  --lh-body-m: var(--e-global-typography-d059757-line-height, 1.6);

  --fs-body-s: var(--e-global-typography-bf8ba02-font-size, 0.875rem);
  --lh-body-s: var(--e-global-typography-bf8ba02-line-height, 1.6);

  --fs-label-m: var(--e-global-typography-f25273c-font-size, 0.875rem);
  --lh-label-m: var(--e-global-typography-f25273c-line-height, 1.5);
  --fw-label-m: var(--e-global-typography-f25273c-font-weight, 500);

  --fs-label-s: var(--e-global-typography-e240f6d-font-size, 0.8125rem);
  --lh-label-s: var(--e-global-typography-e240f6d-line-height, 1.5);
  --fw-label-s: var(--e-global-typography-e240f6d-font-weight, 500);

  --fs-caption: var(--e-global-typography-1f2fb55-font-size, 0.8125rem);
  --lh-caption: 1.4;
  --ls-caption: var(--e-global-typography-1f2fb55-letter-spacing, 0.04em);

  /* Fluid scale sınırları (clamp için) */
  --vw-min: 320px;
  --vw-max: 1440px;
  --vw-range: calc(var(--vw-max) - var(--vw-min));
}

/* ===============================
   2) FLUID TYPE OVERRIDES (clamp)
   Not: Aynı değişkenleri override eder → okunur kalsın diye
   =============================== */
:root {
  font-size: 14px;
  --fs-display-xxl: clamp(3rem, calc(3rem + (4.5rem - 3rem) * ((100vw - var(--vw-min)) / var(--vw-range))), 4.5rem);

  --fs-h-xl: clamp(2rem, calc(2rem + (3rem - 2rem) * ((100vw - var(--vw-min)) / var(--vw-range))), 3rem);
  --fs-h-l: clamp(1.5rem, calc(1.5rem + (2.25rem - 1.5rem) * ((100vw - var(--vw-min)) / var(--vw-range))), 2.25rem);
  --fs-h-m: clamp(1.25rem, calc(1.25rem + (1.75rem - 1.25rem) * ((100vw - var(--vw-min)) / var(--vw-range))), 1.75rem);
  --fs-h-s: clamp(1.125rem, calc(1.125rem + (1.5rem - 1.125rem) * ((100vw - var(--vw-min)) / var(--vw-range))), 1.5rem);
  --fs-h-xs: clamp(1.125rem, calc(1.125rem + (1.25rem - 1.125rem) * ((100vw - var(--vw-min)) / var(--vw-range))), 1.25rem);

  --fs-body-l: clamp(1rem, calc(1rem + (1.125rem - 1rem) * ((100vw - var(--vw-min)) / var(--vw-range))), 1.125rem);
  --fs-body-m: clamp(1rem, calc(1rem + (1.125rem - 1rem) * ((100vw - var(--vw-min)) / var(--vw-range))), 1.125rem);
  --fs-body-s: clamp(0.875rem, calc(0.875rem + (1rem - 0.875rem) * ((100vw - var(--vw-min)) / var(--vw-range))), 1rem);

  --fs-label-m: clamp(0.875rem, calc(0.875rem + (0.9375rem - 0.875rem) * ((100vw - var(--vw-min)) / var(--vw-range))), 0.9375rem);
  --fs-label-s: clamp(0.8125rem, calc(0.8125rem + (0.9375rem - 0.8125rem) * ((100vw - var(--vw-min)) / var(--vw-range))), 0.9375rem);
  --fs-caption: clamp(0.8125rem, calc(0.8125rem + (0.9375rem - 0.8125rem) * ((100vw - var(--vw-min)) / var(--vw-range))), 0.9375rem);

  --fs-button-m: var(--fs-body-m);
  --fs-button-s: var(--fs-label-s);

  --header-height: 7rem;
}

/* ===============================
   3) BASE ELEMENTS
   =============================== */
html,
body {
  max-width: 100vw;
  overflow-x: hidden;
}

body {
  font-family: var(--font-family-text);
  font-size: var(--fs-body-m);
  line-height: var(--lh-body-m);
  font-weight: var(--fw-regular);
  color: var(--e-global-color-text-primary);
  background-color: var(--e-global-color-bg-primary);
}

h1,
h2,
h3,
h4,
h5,
h6 {
  color: currentColor;
}

.masthead__scroll_item {
  display: none;
}

.bg-beige-light {
  background-color: var(--e-global-color-bg-secondary);
}

.fa {
  font-family: FontAwesome;
  color: var(--e-global-color-primary)
}

.elementor-element svg {
  &[fill="none"] {
    fill: none !important;
  }
}