/*
Theme Name:        WebRise Starter
Theme URI:         https://webrisestudio.ch
Author:            WebRise Studio
Author URI:        https://webrisestudio.ch
Description:       Professionelles Blank-Slate WordPress Theme, optimiert für Elementor und WebRise Build Studio. Vollständig anpassbar via WebRise OS Design-Token-System.
Version:           1.2.1
Requires at least: 6.0
Tested up to:      6.7
Requires PHP:      8.0
License:           Proprietary
License URI:       https://webrisestudio.ch/license
Text Domain:       webrise-starter
Tags:              full-site-editing, elementor, blank, minimal, professional

WebRise Starter Theme — Developed with ♥ by WebRise Studio
*/

/* ============================================================
   CSS CUSTOM PROPERTIES — WebRise Design Token System
   These tokens are dynamically set by WebRise OS via WP-CLI
   during the build process (from approved Mockup/Demo design).
   ============================================================ */
:root {
  /* ─── Brand Colors (set from Mockup designTokens) ─── */
  --wr-accent:           #b3e31e;
  --wr-accent-dark:      #8ab515;
  --wr-accent-light:     #d4f060;
  --wr-accent-rgb:       179, 227, 30;

  /* ─── Neutral Palette ─── */
  --wr-color-bg:         #ffffff;
  --wr-color-bg-alt:     #f5f5f7;
  --wr-color-bg-dark:    #1a1a1a;
  --wr-color-surface:    #ffffff;
  --wr-color-surface-alt:#f9f9f9;
  --wr-color-border:     rgba(0, 0, 0, 0.08);
  --wr-color-border-dark:rgba(0, 0, 0, 0.16);

  /* ─── Text Colors ─── */
  --wr-color-text:       #1a1a1a;
  --wr-color-text-muted: #6e6e73;
  --wr-color-text-light: #aeaeb2;
  --wr-color-heading:    #111111;
  --wr-color-link:       var(--wr-accent-dark);

  /* ─── Typography (set from Mockup designTokens) ─── */
  --wr-font-heading:     'Inter', -apple-system, BlinkMacSystemFont, sans-serif;
  --wr-font-body:        'Inter', -apple-system, BlinkMacSystemFont, sans-serif;
  --wr-font-mono:        'SF Mono', 'Fira Code', Consolas, monospace;
  --wr-font-size-xs:     12px;
  --wr-font-size-sm:     14px;
  --wr-font-size-base:   16px;
  --wr-font-size-lg:     18px;
  --wr-font-size-xl:     20px;
  --wr-font-size-2xl:    24px;
  --wr-font-size-3xl:    32px;
  --wr-font-size-4xl:    48px;
  --wr-font-size-5xl:    64px;
  --wr-font-size-6xl:    80px;
  --wr-font-weight-normal:   400;
  --wr-font-weight-medium:   500;
  --wr-font-weight-semibold: 600;
  --wr-font-weight-bold:     700;
  --wr-font-weight-black:    800;
  --wr-line-height:      1.65;
  --wr-line-height-tight:1.2;
  --wr-letter-spacing:   -0.01em;
  --wr-letter-spacing-tight: -0.03em;

  /* ─── Spacing Scale ─── */
  --wr-space-1:   4px;
  --wr-space-2:   8px;
  --wr-space-3:   12px;
  --wr-space-4:   16px;
  --wr-space-5:   20px;
  --wr-space-6:   24px;
  --wr-space-8:   32px;
  --wr-space-10:  40px;
  --wr-space-12:  48px;
  --wr-space-16:  64px;
  --wr-space-20:  80px;
  --wr-space-24:  96px;
  --wr-space-32:  128px;
  --wr-space-40:  160px;
  --wr-space-48:  192px;

  /* ─── Border Radius ─── */
  --wr-radius-sm:     4px;
  --wr-radius:        8px;
  --wr-radius-md:     12px;
  --wr-radius-lg:     16px;
  --wr-radius-xl:     24px;
  --wr-radius-2xl:    32px;
  --wr-radius-full:   9999px;

  /* ─── Shadows ─── */
  --wr-shadow-xs: 0 1px 3px rgba(0, 0, 0, 0.05);
  --wr-shadow:    0 2px 12px rgba(0, 0, 0, 0.06);
  --wr-shadow-md: 0 8px 32px rgba(0, 0, 0, 0.10);
  --wr-shadow-lg: 0 24px 64px rgba(0, 0, 0, 0.12);
  --wr-shadow-xl: 0 40px 120px rgba(0, 0, 0, 0.16);

  /* ─── Z-Index Scale ─── */
  --wr-z-base:    0;
  --wr-z-raised:  10;
  --wr-z-overlay: 100;
  --wr-z-modal:   1000;
  --wr-z-toast:   9999;

  /* ─── Transitions ─── */
  --wr-transition:      0.2s cubic-bezier(0.22, 1, 0.36, 1);
  --wr-transition-fast: 0.1s cubic-bezier(0.22, 1, 0.36, 1);
  --wr-transition-slow: 0.4s cubic-bezier(0.22, 1, 0.36, 1);

  /* ─── Layout ─── */
  --wr-container:       1280px;
  --wr-container-sm:    960px;
  --wr-container-lg:    1440px;
  --wr-header-height:   80px;
}

/* ============================================================
   BASE RESET — Minimal, opinionless
   ============================================================ */
*, *::before, *::after {
  box-sizing: border-box;
}

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

body {
  font-family: var(--wr-font-body);
  font-size: var(--wr-font-size-base);
  line-height: var(--wr-line-height);
  color: var(--wr-color-text);
  background-color: var(--wr-color-bg);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  overflow-x: hidden;
  margin: 0;
  padding: 0;
}

/* ─── Typography ─── */
h1, h2, h3, h4, h5, h6 {
  font-family: var(--wr-font-heading);
  font-weight: var(--wr-font-weight-bold);
  line-height: var(--wr-line-height-tight);
  letter-spacing: var(--wr-letter-spacing-tight);
  color: var(--wr-color-heading);
  margin-top: 0;
}

a {
  color: var(--wr-color-link);
  text-decoration: none;
  transition: color var(--wr-transition-fast);
}

a:hover {
  color: var(--wr-accent-dark);
}

img, video {
  max-width: 100%;
  height: auto;
  display: block;
}

/* ─── Form Elements ─── */
input, textarea, select, button {
  font-family: var(--wr-font-body);
  font-size: var(--wr-font-size-base);
}

button {
  cursor: pointer;
  border: none;
  background: none;
  padding: 0;
}

/* ─── Scrollbar (subtle) ─── */
::-webkit-scrollbar {
  width: 6px;
  background: transparent;
}

::-webkit-scrollbar-thumb {
  background: rgba(0, 0, 0, 0.15);
  border-radius: var(--wr-radius-full);
}

/* ─── Selection ─── */
::selection {
  background-color: rgba(var(--wr-accent-rgb), 0.3);
  color: var(--wr-color-text);
}

/* ─── Focus Styles (Accessibility) ─── */
:focus-visible {
  outline: 2px solid var(--wr-accent);
  outline-offset: 2px;
  border-radius: var(--wr-radius-sm);
}

/* ============================================================
   WEBRISE UTILITY CLASSES
   ============================================================ */

/* Layout */
.wr-container {
  max-width: var(--wr-container);
  margin-left: auto;
  margin-right: auto;
  padding-left: var(--wr-space-6);
  padding-right: var(--wr-space-6);
}

.wr-container--sm { max-width: var(--wr-container-sm); }
.wr-container--lg { max-width: var(--wr-container-lg); }
.wr-container--full { max-width: 100%; }

/* Section Spacing */
.wr-section {
  padding-top: var(--wr-space-32);
  padding-bottom: var(--wr-space-32);
}

.wr-section--sm {
  padding-top: var(--wr-space-16);
  padding-bottom: var(--wr-space-16);
}

.wr-section--lg {
  padding-top: var(--wr-space-48);
  padding-bottom: var(--wr-space-48);
}

/* Backgrounds */
.wr-bg-alt     { background-color: var(--wr-color-bg-alt); }
.wr-bg-dark    { background-color: var(--wr-color-bg-dark); color: #fff; }
.wr-bg-accent  { background-color: var(--wr-accent); }

/* Text Utilities */
.wr-text-muted { color: var(--wr-color-text-muted); }
.wr-text-light { color: var(--wr-color-text-light); }
.wr-text-center { text-align: center; }
.wr-text-accent { color: var(--wr-accent-dark); }

/* Visually Hidden (Accessibility) */
.wr-sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

/* ============================================================
   ELEMENTOR OVERRIDES
   Make Elementor work perfectly with our theme
   ============================================================ */

/* Full-width pages */
.page-template-fullwidth .elementor-section,
.page-template-landing .elementor-section,
.page-template-canvas .elementor-section {
  width: 100%;
}

/* Remove default WP content area on Elementor pages */
.elementor-page .site-content {
  padding: 0;
  margin: 0;
}

/* Elementor Canvas Template: Zero chrome */
.page-template-canvas #header,
.page-template-canvas #footer {
  display: none;
}

/* ============================================================
   WEBRISE PLUGIN ZONES
   Empty zones that WebRise plugins hook into
   ============================================================ */

.wr-zone-before-header,
.wr-zone-after-header,
.wr-zone-before-footer,
.wr-zone-after-footer {
  position: relative;
}

/* ============================================================
   PRINT STYLES
   ============================================================ */
@media print {
  .wr-no-print { display: none !important; }

  body {
    font-size: 12pt;
    color: #000;
    background: #fff;
  }

  a::after {
    content: " (" attr(href) ")";
    font-size: 0.8em;
    color: #666;
  }
}