.elementor-kit-8{--e-global-color-primary:#6EC1E4;--e-global-color-secondary:#54595F;--e-global-color-text:#7A7A7A;--e-global-color-accent:#61CE70;--e-global-typography-primary-font-family:"Roboto";--e-global-typography-primary-font-weight:600;--e-global-typography-secondary-font-family:"Roboto Slab";--e-global-typography-secondary-font-weight:400;--e-global-typography-text-font-family:"Roboto";--e-global-typography-text-font-weight:400;--e-global-typography-accent-font-family:"Roboto";--e-global-typography-accent-font-weight:500;}.elementor-kit-8 e-page-transition{background-color:#FFBC7D;}.elementor-section.elementor-section-boxed > .elementor-container{max-width:1140px;}.e-con{--container-max-width:1140px;--container-default-padding-top:0px;--container-default-padding-right:0px;--container-default-padding-bottom:0px;--container-default-padding-left:0px;}.elementor-widget:not(:last-child){margin-block-end:20px;}.elementor-element{--widgets-spacing:20px 20px;--widgets-spacing-row:20px;--widgets-spacing-column:20px;}{}h1.entry-title{display:var(--page-title-display);}.site-header .site-branding{flex-direction:column;align-items:stretch;}.site-header{padding-inline-end:0px;padding-inline-start:0px;}.site-footer .site-branding{flex-direction:column;align-items:stretch;}@media(max-width:1024px){.elementor-section.elementor-section-boxed > .elementor-container{max-width:1024px;}.e-con{--container-max-width:1024px;}}@media(max-width:768px){.elementor-section.elementor-section-boxed > .elementor-container{max-width:767px;}.e-con{--container-max-width:767px;}}/* Start custom CSS *//* ================================================================
   SAVANNA SEATING — SITE ROOT CSS
   Add once in Elementor Site Settings → Custom CSS.
   Keep component and page-specific CSS out of this file.
   ================================================================ */

:root {
  /* Brand colours */
  --ss-charcoal: #26231f;
  --ss-charcoal-soft: #38342f;
  --ss-clay: #b96845;
  --ss-clay-dark: #9f5739;
  --ss-sand: #d7be98;
  --ss-ivory: #fbf7ef;
  --ss-stone: #f3eee6;
  --ss-white: #ffffff;

  /* Content colours */
  --ss-text: #26231f;
  --ss-text-muted: #746d64;
  --ss-border: #e5ddd1;
  --ss-border-strong: #cfc4b5;
  --ss-success: #2f6b4f;
  --ss-error: #b42318;
  --ss-whatsapp: #25d366;

  /* Typography */
  --ss-font-heading: "Manrope", "Inter", Arial, sans-serif;
  --ss-font-body: "Inter", Arial, sans-serif;
  --ss-weight-regular: 400;
  --ss-weight-medium: 500;
  --ss-weight-semibold: 600;
  --ss-weight-bold: 700;

  /* Layout */
  --ss-content-width: 1380px;
  --ss-reading-width: 760px;
  --ss-page-gutter: clamp(16px, 3vw, 40px);
  --ss-section-space: clamp(64px, 8vw, 112px);
  --ss-section-space-small: clamp(40px, 5vw, 72px);

  /* Shape and motion */
  --ss-radius-small: 2px;
  --ss-radius-medium: 6px;
  --ss-shadow-small: 0 8px 24px rgba(38, 35, 31, 0.08);
  --ss-shadow-large: 0 22px 60px rgba(38, 35, 31, 0.14);
  --ss-transition: 180ms ease;
}

/* ================================================================
   DOCUMENT FOUNDATION
   ================================================================ */

html {
  box-sizing: border-box;
  scroll-behavior: smooth;
  -webkit-text-size-adjust: 100%;
}

*,
*::before,
*::after {
  box-sizing: inherit;
}

body {
  margin: 0;
  color: var(--ss-text);
  background: var(--ss-white);
  font-family: var(--ss-font-body);
  font-size: 16px;
  font-weight: var(--ss-weight-regular);
  line-height: 1.65;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
}

body,
button,
input,
select,
textarea {
  font-family: var(--ss-font-body);
}

::selection {
  color: var(--ss-white);
  background: var(--ss-clay);
}

img,
svg,
video {
  max-width: 100%;
}

img {
  height: auto;
}

/* ================================================================
   TYPOGRAPHY
   ================================================================ */

h1,
h2,
h3,
h4,
h5,
h6 {
  margin-top: 0;
  color: var(--ss-charcoal);
  font-family: var(--ss-font-heading);
  font-weight: var(--ss-weight-bold);
  line-height: 1.15;
  letter-spacing: -0.025em;
}

h1 {
  font-size: clamp(2.35rem, 5vw, 4.8rem);
}

h2 {
  font-size: clamp(1.9rem, 3.5vw, 3.25rem);
}

h3 {
  font-size: clamp(1.35rem, 2.2vw, 2rem);
}

h4 {
  font-size: clamp(1.1rem, 1.6vw, 1.35rem);
}

p {
  margin-top: 0;
  margin-bottom: 1em;
}

p:last-child {
  margin-bottom: 0;
}

small {
  font-size: 0.8125rem;
}

strong,
b {
  font-weight: var(--ss-weight-bold);
}

a {
  color: var(--ss-charcoal);
  text-decoration-color: rgba(185, 104, 69, 0.45);
  text-underline-offset: 0.18em;
  transition: color var(--ss-transition), border-color var(--ss-transition), background-color var(--ss-transition);
}

a:hover {
  color: var(--ss-clay-dark);
}

hr {
  height: 1px;
  margin: 2rem 0;
  border: 0;
  background: var(--ss-border);
}

/* ================================================================
   ACCESSIBILITY
   ================================================================ */

:where(a, button, input, select, textarea, summary):focus-visible {
  outline: 2px solid var(--ss-clay);
  outline-offset: 3px;
}

.screen-reader-text {
  position: absolute !important;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

/* ================================================================
   BUTTONS
   ================================================================ */

:where(.ss-button, .elementor-button, button, input[type="submit"], input[type="button"]) {
  border-radius: var(--ss-radius-small);
}

.ss-button,
.ss-button-primary,
.ss-button-secondary {
  min-height: 48px;
  padding: 0 22px;
  border: 1px solid transparent;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 9px;
  font-family: var(--ss-font-body);
  font-size: 0.875rem;
  font-weight: var(--ss-weight-bold);
  line-height: 1;
  text-decoration: none;
  cursor: pointer;
  transition: color var(--ss-transition), background-color var(--ss-transition), border-color var(--ss-transition), transform var(--ss-transition);
}

.ss-button-primary {
  color: var(--ss-white);
  background: var(--ss-charcoal);
}

.ss-button-primary:hover {
  color: var(--ss-white);
  background: var(--ss-clay-dark);
}

.ss-button-secondary {
  color: var(--ss-charcoal);
  background: transparent;
  border-color: var(--ss-charcoal);
}

.ss-button-secondary:hover {
  color: var(--ss-white);
  background: var(--ss-charcoal);
}

/* ================================================================
   FORMS
   ================================================================ */

:where(input[type="text"], input[type="email"], input[type="tel"], input[type="search"], input[type="number"], input[type="password"], input[type="url"], select, textarea) {
  width: 100%;
  min-height: 48px;
  padding: 11px 14px;
  color: var(--ss-text);
  background: var(--ss-white);
  border: 1px solid var(--ss-border-strong);
  border-radius: var(--ss-radius-small);
  font-size: 0.9375rem;
  line-height: 1.4;
  transition: border-color var(--ss-transition), box-shadow var(--ss-transition);
}

textarea {
  min-height: 140px;
  resize: vertical;
}

:where(input, select, textarea)::placeholder {
  color: #958d83;
  opacity: 1;
}

:where(input, select, textarea):focus {
  border-color: var(--ss-clay);
  outline: 0;
  box-shadow: 0 0 0 3px rgba(185, 104, 69, 0.12);
}

label {
  color: var(--ss-charcoal);
  font-size: 0.875rem;
  font-weight: var(--ss-weight-semibold);
}

/* ================================================================
   REUSABLE LAYOUT HELPERS
   ================================================================ */

.ss-container {
  width: min(calc(100% - (var(--ss-page-gutter) * 2)), var(--ss-content-width));
  margin-inline: auto;
}

.ss-reading-width {
  width: min(100%, var(--ss-reading-width));
}

.ss-section {
  padding-block: var(--ss-section-space);
}

.ss-section-small {
  padding-block: var(--ss-section-space-small);
}

.ss-bg-ivory {
  background: var(--ss-ivory);
}

.ss-bg-stone {
  background: var(--ss-stone);
}

.ss-bg-charcoal {
  color: var(--ss-ivory);
  background: var(--ss-charcoal);
}

.ss-bg-charcoal :where(h1, h2, h3, h4, h5, h6) {
  color: var(--ss-white);
}

.ss-eyebrow {
  margin-bottom: 12px;
  color: var(--ss-clay-dark);
  font-size: 0.75rem;
  font-weight: var(--ss-weight-bold);
  line-height: 1.3;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}

/* ================================================================
   ELEMENTOR FOUNDATION
   ================================================================ */

.elementor-widget-text-editor :where(ul, ol) {
  padding-left: 1.25rem;
}

.elementor-widget-text-editor li + li {
  margin-top: 0.45rem;
}

.elementor-button {
  font-weight: var(--ss-weight-bold);
}

/* ================================================================
   WOOCOMMERCE FOUNDATION
   Component-specific shop styling belongs in the plugin or template.
   ================================================================ */

.woocommerce-message,
.woocommerce-info,
.woocommerce-error {
  margin: 0 0 22px;
  padding: 16px 18px 16px 48px;
  color: var(--ss-text);
  background: var(--ss-ivory);
  border: 1px solid var(--ss-border);
  border-top: 0;
  border-left: 3px solid var(--ss-clay);
  border-radius: 0;
  box-shadow: none;
  font-size: 0.875rem;
}

.woocommerce-message::before,
.woocommerce-info::before {
  color: var(--ss-success);
}

.woocommerce-error {
  border-left-color: var(--ss-error);
}

.woocommerce-error::before {
  color: var(--ss-error);
}

.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button {
  border-radius: var(--ss-radius-small);
}

/* ================================================================
   RESPONSIVE FOUNDATION
   ================================================================ */

@media (max-width: 767px) {
  :root {
    --ss-page-gutter: 16px;
    --ss-section-space: 64px;
    --ss-section-space-small: 40px;
  }

  body {
    font-size: 15px;
  }
}

@media (prefers-reduced-motion: reduce) {
  html {
    scroll-behavior: auto;
  }

  *,
  *::before,
  *::after {
    scroll-behavior: auto !important;
    transition-duration: 0.01ms !important;
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
  }
}/* End custom CSS */