/*
Theme Name: Luciano Dental - Implantes
Theme URI: https://drlucianoroale.com.br
Author: Dr. Luciano Roale
Author URI: https://drlucianoroale.com.br
Description: Tema profissional de alta conversao para clinica de implantes dentarios. Otimizado para Meta Ads, Google Tag Manager e captacao de leads via WhatsApp. Compativel com Elementor.
Version: 1.0.0
Requires at least: 6.0
Tested up to: 6.7
Requires PHP: 8.0
License: Proprietary
License URI: https://drlucianoroale.com.br
Text Domain: luciano-dental
Tags: landing-page, elementor, implantes, dentista, conversao
*/

/* ============================================================
   CSS CUSTOM PROPERTIES — DESIGN TOKENS (Stitch Design)
   Edite aqui para mudar o visual de todo o site
   ============================================================ */

:root {
  /* --- Stitch Core Colors --- */
  --color-primary:              #1B4F72;   /* Primary brand color */
  --color-primary-fixed:        #cce5ff;   /* Primary fixed light */
  --color-primary-fixed-dim:    #9dcbf4;   /* Primary fixed dim */
  --color-on-primary:           #ffffff;
  --color-on-primary-fixed:     #001e31;
  --color-on-primary-fixed-variant: #154b6d;
  --color-primary-container:    #1B4F72;
  --color-on-primary-container: #92c0e9;

  --color-secondary:            #006397;
  --color-secondary-fixed:      #cce5ff;
  --color-secondary-fixed-dim:  #92ccff;
  --color-on-secondary:         #ffffff;
  --color-on-secondary-fixed:   #001d31;
  --color-on-secondary-fixed-variant: #004b73;
  --color-secondary-container:  #71c0fe;
  --color-on-secondary-container: #004d77;

  --color-tertiary:             #552800;
  --color-tertiary-fixed:       #ffdcc5;
  --color-tertiary-fixed-dim:   #ffb783;
  --color-on-tertiary:          #ffffff;
  --color-on-tertiary-fixed:    #301400;
  --color-on-tertiary-fixed-variant: #713700;
  --color-tertiary-container:   #773b00;
  --color-on-tertiary-container: #ffa765;

  --color-error:                #ba1a1a;
  --color-error-container:      #ffdad6;
  --color-on-error:             #ffffff;
  --color-on-error-container:   #93000a;

  /* --- Surface Colors --- */
  --color-surface:              #f8f9fa;
  --color-surface-alt:          #edeeef;
  --color-surface-container-lowest: #ffffff;
  --color-surface-container-low:  #f3f4f5;
  --color-surface-container:      #edeeef;
  --color-surface-container-high: #e7e8e9;
  --color-surface-container-highest: #e1e3e4;
  --color-surface-bright:       #f8f9fa;
  --color-surface-dim:          #d9dadb;
  --color-surface-tint:         #326286;
  --color-inverse-surface:      #2e3132;
  --color-inverse-on-surface:   #f0f1f2;

  --color-background:           #f8f9fa;
  --color-on-background:        #191c1d;
  --color-on-surface:           #191c1d;
  --color-on-surface-variant:   #41474e;
  --color-surface-variant:      #e1e3e4;

  --color-outline:              #72787f;
  --color-outline-variant:      #c1c7cf;

  --color-inverse-primary:      #9dcbf4;
  --color-accent-orange:        #E67E22;

  /* --- Cores de Destaque (CTA / Urgencia) --- */
  --color-accent:               #E67E22;   /* Laranja quente — botoes CTA */
  --color-accent-light:         #F39C12;   /* Laranja claro hover */
  --color-accent-dark:          #CA6F1E;   /* Laranja escuro pressed */

  /* --- Textos --- */
  --color-text:                 #191c1d;   /* Texto principal */
  --color-text-secondary:       #41474e;   /* Texto secundario */
  --color-text-muted:           #72787f;   /* Texto desabilitado/placeholder */
  --color-text-inverse:         #ffffff;   /* Texto sobre fundos escuros */

  /* --- Feedback --- */
  --color-success:              #27AE60;
  --color-success-bg:           #EAFAF1;

  /* --- Bordas --- */
  --color-border:               #e1e3e4;
  --color-border-focus:         var(--color-primary);

  /* --- Tipografia --- */
  --font-heading:         'Playfair Display', Georgia, serif;
  --font-body:            'Inter', 'Segoe UI', system-ui, sans-serif;
  --font-mono:            'Fira Code', monospace;

  --text-xs:    0.75rem;   /* 12px */
  --text-sm:    0.875rem;  /* 14px */
  --text-base:  1rem;      /* 16px */
  --text-lg:    1.125rem;  /* 18px */
  --text-xl:    1.25rem;   /* 20px */
  --text-2xl:   1.5rem;    /* 24px */
  --text-3xl:   1.875rem;  /* 30px */
  --text-4xl:   2.25rem;   /* 36px */
  --text-5xl:   3rem;      /* 48px */
  --text-6xl:   3.75rem;   /* 60px */

  --leading-tight:  1.25;
  --leading-snug:   1.375;
  --leading-normal: 1.5;
  --leading-relaxed:1.625;

  --font-weight-normal:   400;
  --font-weight-medium:   500;
  --font-weight-semibold: 600;
  --font-weight-bold:     700;
  --font-weight-extrabold:800;

  /* --- Espacamento (escala 4px) --- */
  --space-1:   0.25rem;   /* 4px */
  --space-2:   0.5rem;    /* 8px */
  --space-3:   0.75rem;   /* 12px */
  --space-4:   1rem;      /* 16px */
  --space-5:   1.25rem;   /* 20px */
  --space-6:   1.5rem;    /* 24px */
  --space-8:   2rem;      /* 32px */
  --space-10:  2.5rem;    /* 40px */
  --space-12:  3rem;      /* 48px */
  --space-16:  4rem;      /* 64px */
  --space-20:  5rem;      /* 80px */
  --space-24:  6rem;      /* 96px */
  --space-32:  8rem;      /* 128px */

  /* --- Bordas e Sombras (Stitch) --- */
  --radius-sm:   0.25rem;
  --radius-md:   0.5rem;
  --radius-lg:   2rem;    /* Stitch: lg = 2rem */
  --radius-xl:   3rem;    /* Stitch: xl = 3rem */
  --radius-2xl:  4rem;
  --radius-full: 9999px;

  --shadow-sm:   0 1px 2px 0 rgba(0,0,0,0.05);
  --shadow-md:   0 4px 6px -1px rgba(0,0,0,0.1), 0 2px 4px -2px rgba(0,0,0,0.1);
  --shadow-lg:   0 10px 15px -3px rgba(0,0,0,0.1), 0 4px 6px -4px rgba(0,0,0,0.1);
  --shadow-xl:   0 20px 25px -5px rgba(0,0,0,0.1), 0 8px 10px -6px rgba(0,0,0,0.1);
  --shadow-2xl:  0 25px 50px -12px rgba(0,0,0,0.25);
  --shadow-card: 0 2px 20px rgba(27, 79, 114, 0.12);
  --shadow-cta:  0 8px 32px rgba(230, 126, 34, 0.35);
  --shadow-soft-3d: 0 20px 30px rgba(0, 56, 87, 0.1);

  /* --- Transicoes --- */
  --transition-fast:   150ms ease-out;
  --transition-base:   250ms ease-out;
  --transition-slow:   350ms ease-out;

  /* --- Layout --- */
  --container-max:  1200px;
  --container-wide: 1400px;
  --section-py:     var(--space-20);

  /* --- Z-index --- */
  --z-dropdown:  1000;
  --z-sticky:    1020;
  --z-fixed:     1030;
  --z-modal:     1050;
  --z-toast:     1080;
  --z-whatsapp:  1090;
}

/* ============================================================
   STITCH DESIGN UTILITIES
   ============================================================ */

/* Gradient backgrounds */
.primary-gradient {
  background: linear-gradient(135deg, #1B4F72 0%, #003857 100%);
}

.accent-gradient {
  background: linear-gradient(135deg, #E67E22 0%, #D35400 100%);
}

/* Glass navigation effect */
.glass-nav {
  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);
}

/* Material Symbols base */
.material-symbols-outlined {
  font-family: 'Material Symbols Outlined';
  font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 24;
  font-weight: normal;
  font-style: normal;
  line-height: 1;
  letter-spacing: normal;
  text-transform: none;
  display: inline-block;
  white-space: nowrap;
  word-wrap: normal;
  direction: ltr;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.material-symbols-outlined--filled {
  font-variation-settings: 'FILL' 1, 'wght' 400, 'GRAD' 0, 'opsz' 24;
}

/* Soft 3D shadow for icons */
.soft-3d-shadow {
  filter: drop-shadow(0 20px 30px rgba(0, 56, 87, 0.1));
}
