/*
Theme Name: Kavana Theme
Theme URI: https://kavanainterior.com
Author: Kavana Interior
Description: Premium interior design theme. Light, modern, professional.
Version: 2.0.0
Requires at least: 6.0
Tested up to: 6.5
Requires PHP: 8.0
License: GNU General Public License v2 or later
Text Domain: kavanatheme
Tags: interior-design, custom-menu, custom-logo, full-width-template
*/

/* ═══════════════════════════════════════════════════════
   FONTS
═══════════════════════════════════════════════════════ */
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&family=Playfair+Display:ital,wght@0,600;0,700;1,500;1,600&display=swap');

/* ═══════════════════════════════════════════════════════
   RESET
═══════════════════════════════════════════════════════ */
*,*::before,*::after { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; font-size: 16px; -webkit-text-size-adjust: 100%; }
body { font-family: var(--font-body); background: #fff; color: #1a1a1a; line-height: 1.7; overflow-x: hidden; -webkit-font-smoothing: antialiased; padding-top: var(--nav-h); }
body.has-ann-bar { padding-top: calc(var(--nav-h) + 36px); }
img { max-width: 100%; height: auto; display: block; }
a { text-decoration: none; color: inherit; }
ul,ol { list-style: none; }
button { cursor: pointer; border: none; background: none; font-family: inherit; }
input,textarea,select { font-family: inherit; }
h1,h2,h3,h4,h5,h6 { font-weight: 700; line-height: 1.25; }

/* ═══════════════════════════════════════════════════════
   DESIGN TOKENS
═══════════════════════════════════════════════════════ */
:root {
  /* ── White / Light backgrounds */
  --white:       #ffffff;
  --bg-light:    #faf9f7;
  --bg-muted:    #f3f1ed;
  --bg-dark:     #1c2b3a;

  /* ── Brand Orange (primary CTA colour) */
  --orange:      #e8612d;
  --orange-dark: #c9501e;
  --orange-bg:   #fff3ee;
  --orange-ring: rgba(232,97,45,0.18);

  /* ── Navy (headings, dark text) */
  --navy:        #1c2b3a;
  --navy-light:  #2d4561;

  /* ── Text */
  --text-dark:   #1a1a1a;
  --text-mid:    #4a4a4a;
  --text-muted:  #767676;
  --text-faint:  #a0a0a0;

  /* ── Borders */
  --border:      #e2dfd9;
  --border-soft: rgba(0,0,0,0.06);

  /* ── Success / Danger */
  --green:       #27ae60;
  --red:         #e74c3c;

  /* ── Typography */
  --font-display: 'Playfair Display', Georgia, serif;
  --font-body:    'Inter', system-ui, -apple-system, sans-serif;

  /* ── Shadows */
  --sh-xs:  0 1px 4px rgba(0,0,0,0.06);
  --sh-sm:  0 2px 14px rgba(0,0,0,0.08);
  --sh-md:  0 8px 32px rgba(0,0,0,0.10);
  --sh-lg:  0 20px 60px rgba(0,0,0,0.13);

  /* ── Motion */
  --ease: cubic-bezier(0.4, 0, 0.2, 1);
  --t:    0.24s;

  /* ── Layout */
  --wrap:  1220px;
  --nav-h: 44px;
  --r:     6px;
  --r-lg:  14px;
  --r-xl:  22px;
}

/* ═══════════════════════════════════════════════════════
   LAYOUT HELPERS
═══════════════════════════════════════════════════════ */
.wrap         { max-width: var(--wrap); margin-inline: auto; padding-inline: clamp(1rem,4vw,2.5rem); width: 100%; }
.section      { padding-block: clamp(3.5rem,7vw,5.5rem); }
.section-sm   { padding-block: clamp(2rem,4vw,3.2rem); }
.center       { text-align: center; }
.col-2        { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(2rem,4vw,5rem); align-items: center; }
.col-3        { display: grid; grid-template-columns: repeat(3,1fr); gap: 1.2rem; }
.col-4        { display: grid; grid-template-columns: repeat(4,1fr); gap: 1.2rem; }

/* ═══════════════════════════════════════════════════════
   TYPOGRAPHY
═══════════════════════════════════════════════════════ */
.eyebrow {
  display: inline-flex; align-items: center; gap: .45rem;
  font-size: .68rem; font-weight: 700; letter-spacing: .18em;
  text-transform: uppercase; color: var(--orange); margin-bottom: .75rem;
}
.eyebrow::before { content: ''; width: 20px; height: 2px; background: var(--orange); border-radius: 2px; }

.heading {
  font-family: var(--font-display);
  font-size: clamp(1.85rem,3.8vw,3.1rem);
  font-weight: 700; line-height: 1.2;
  color: var(--navy); margin-bottom: .9rem;
}
.heading em { font-style: italic; color: var(--orange); }
.heading-xl  { font-size: clamp(2.2rem,5vw,4rem); }
.heading-sm  { font-size: clamp(1.4rem,2.5vw,2rem); }

.subtext {
  font-size: .97rem; color: var(--text-muted);
  max-width: 520px; line-height: 1.8;
}
.subtext-c { margin-inline: auto; }

.rule { width: 44px; height: 3px; background: var(--orange); border-radius: 2px; margin-block: 1.1rem; }
.rule-c { margin-inline: auto; }

/* ═══════════════════════════════════════════════════════
   BUTTONS
═══════════════════════════════════════════════════════ */
.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: .45rem;
  padding: .74rem 1.6rem; font-family: var(--font-body); font-size: .8rem;
  font-weight: 600; letter-spacing: .03em; border-radius: var(--r);
  transition: all var(--t) var(--ease); white-space: nowrap; cursor: pointer; line-height: 1;
}
.btn-orange  { background: var(--orange); color: #fff; border: 2px solid var(--orange); }
.btn-orange:hover { background: var(--orange-dark); border-color: var(--orange-dark); transform: translateY(-1px); box-shadow: 0 8px 22px rgba(232,97,45,.3); }
.btn-navy    { background: var(--navy); color: #fff; border: 2px solid var(--navy); }
.btn-navy:hover { background: var(--navy-light); border-color: var(--navy-light); transform: translateY(-1px); }
.btn-outline { background: transparent; border: 2px solid var(--orange); color: var(--orange); }
.btn-outline:hover { background: var(--orange-bg); transform: translateY(-1px); }
.btn-ghost   { background: transparent; border: 1.5px solid var(--border); color: var(--text-muted); }
.btn-ghost:hover { border-color: var(--orange); color: var(--orange); }
.btn-white   { background: #fff; color: var(--navy); border: 2px solid #fff; }
.btn-white:hover { background: var(--orange-bg); color: var(--orange); border-color: var(--orange); }
.btn-lg   { padding: .9rem 2.1rem; font-size: .88rem; }
.btn-sm   { padding: .5rem 1.1rem; font-size: .75rem; }
.btn-full { width: 100%; justify-content: center; }

/* ═══════════════════════════════════════════════════════
   ANNOUNCEMENT BAR
═══════════════════════════════════════════════════════ */
/* ── Announcement Bar — FIXED so it doesn't scroll ── */
.ann-bar {
  background: var(--navy); color: #fff;
  text-align: center; padding: .48rem 3rem;
  font-size: .75rem; line-height: 1.5;
  position: fixed; top: 0; left: 0; right: 0;
  height: 36px; display: flex; align-items: center; justify-content: center;
  z-index: 1002;
}
.ann-bar strong { color: #f5a623; }
.ann-bar .ann-close {
  position: absolute; right: 1rem; top: 50%; transform: translateY(-50%);
  font-size: 1.2rem; opacity: .55; cursor: pointer; background: none; border: none;
  color: #fff; padding: 0 6px; line-height: 1; transition: opacity .2s;
}
.ann-bar .ann-close:hover { opacity: 1; }

/* ═══════════════════════════════════════════════════════
   HEADER — fixed, 3-col grid
═══════════════════════════════════════════════════════ */
#site-header {
  position: fixed; left: 0; right: 0; top: 0;
  z-index: 1000; height: var(--nav-h);
  background: #fff; border-bottom: 1px solid var(--border);
  transition: box-shadow var(--t) var(--ease);
}
#site-header.scrolled { box-shadow: var(--sh-sm); }
/* Ann bar is 36px — push header below it */
.has-ann-bar #site-header { top: 36px; }

/* 3-column grid: [logo area] [nav] [cta+hamburger] */
.hdr-inner {
  display: grid;
  grid-template-columns: 200px 1fr auto;
  align-items: center;
  height: var(--nav-h);
  gap: 1rem;
}

/* LOGO – left */
.site-logo {
  display: flex; flex-direction: column;
  justify-content: center; line-height: 1;
  text-decoration: none; flex-shrink: 0;
}
.site-logo img.custom-logo-img {
  height: 34px; width: auto; max-width: 180px; object-fit: contain; display: block;
}
.logo-text-name {
  font-family: var(--font-display); font-size: 1.18rem; font-weight: 700;
  color: var(--navy); line-height: 1; letter-spacing: -.01em;
}
.logo-text-name span { color: var(--orange); }
.logo-text-tag {
  font-size: .52rem; letter-spacing: .14em; text-transform: uppercase;
  color: var(--text-faint); margin-top: 3px; font-weight: 500;
}

/* NAV – centre */
.hdr-nav {
  display: flex; align-items: center;
  justify-content: center;
  height: var(--nav-h); gap: 0;
}
.hdr-nav ul {
  display: flex; align-items: center;
  height: 100%; gap: 0; list-style: none;
}
.hdr-nav ul li a,
.hdr-nav > a {
  display: flex; align-items: center;
  height: var(--nav-h); padding: 0 .72rem;
  font-size: .79rem; font-weight: 500; color: var(--text-dark);
  letter-spacing: .01em; position: relative; white-space: nowrap;
  transition: color var(--t) var(--ease);
}
.hdr-nav ul li a::after,
.hdr-nav > a::after {
  content: ''; position: absolute; bottom: 0;
  left: .72rem; right: .72rem; height: 2px;
  background: var(--orange); transform: scaleX(0);
  transform-origin: center; transition: transform var(--t) var(--ease);
}
.hdr-nav ul li a:hover,
.hdr-nav > a:hover,
.hdr-nav ul li.current-menu-item > a { color: var(--orange); }
.hdr-nav ul li a:hover::after,
.hdr-nav > a:hover::after,
.hdr-nav ul li.current-menu-item > a::after { transform: scaleX(1); }

/* CTA – right */
/* ── Header right col ── */
.hdr-right { display: flex; align-items: center; gap: .55rem; flex-shrink: 0; }
.desk-cta { white-space: nowrap; }

/* ── Hamburger — always in DOM, shown/hidden via CSS ── */
.hdr-burger {
  display: none; /* shown at ≤900px */
  flex-direction: column; justify-content: center; gap: 5px;
  width: 38px; height: 38px; padding: 8px;
  background: none; border: 1.5px solid var(--border); border-radius: var(--r);
  cursor: pointer; flex-shrink: 0;
}
.hdr-burger span {
  display: block; width: 100%; height: 1.5px;
  background: var(--navy); border-radius: 2px;
  transition: all var(--t) var(--ease); transform-origin: center;
}
.hdr-burger.open span:nth-child(1) { transform: translateY(6.5px) rotate(45deg); }
.hdr-burger.open span:nth-child(2) { opacity: 0; transform: scaleX(0); }
.hdr-burger.open span:nth-child(3) { transform: translateY(-6.5px) rotate(-45deg); }

/* ── Mobile overlay backdrop ── */
.mob-overlay {
  display: none; position: fixed; inset: 0;
  background: rgba(0,0,0,.45); z-index: 1098;
}
.mob-overlay.open { display: block; }

/* ── Mobile Drawer ── */
.mob-nav {
  position: fixed; top: 0; right: -100%; bottom: 0;
  width: min(320px, 85vw); background: #fff; z-index: 1099;
  display: flex; flex-direction: column;
  box-shadow: -4px 0 32px rgba(0,0,0,.18);
  transition: right .28s cubic-bezier(.4,0,.2,1);
  overflow-y: auto;
}
.mob-nav.open { right: 0; }
.mob-close {
  position: absolute; top: .9rem; right: .9rem;
  width: 32px; height: 32px; border-radius: 50%;
  background: var(--bg-light); border: 1px solid var(--border);
  font-size: 1.2rem; cursor: pointer; display: flex;
  align-items: center; justify-content: center; color: var(--text-muted);
  transition: all var(--t); z-index: 1;
}
.mob-close:hover { background: var(--orange); color: #fff; border-color: var(--orange); }
.mob-nav-inner { padding: 3.5rem 1.4rem 2rem; display: flex; flex-direction: column; flex: 1; }
.mob-nav ul { list-style: none; padding: 0; margin: 0; }
.mob-nav ul li a {
  display: flex; align-items: center; justify-content: space-between;
  font-size: 1rem; font-weight: 500; color: var(--text-dark);
  padding: .9rem 0; border-bottom: 1px solid var(--border);
  text-decoration: none; transition: color var(--t), padding-left var(--t);
}
.mob-nav ul li a::after { content: '›'; color: var(--text-faint); font-size: 1.2rem; }
.mob-nav ul li a:hover { color: var(--orange); padding-left: .3rem; }
.mob-nav ul li.current-menu-item a { color: var(--orange); }
.mob-ctas { margin-top: auto; padding-top: 1.5rem; display: flex; flex-direction: column; gap: .65rem; }

/* ═══════════════════════════════════════════════════════
   HERO  – light bg, two-column
═══════════════════════════════════════════════════════ */
.hero {
  background: var(--bg-light);
  padding-top: 5rem;
  padding-bottom: 5rem; overflow: hidden;
  position: relative;
}
/* subtle dot pattern */
.hero::before {
  content: ''; position: absolute; inset: 0;
  background-image: radial-gradient(circle, rgba(232,97,45,.09) 1.5px, transparent 0);
  background-size: 28px 28px; pointer-events: none;
}
.hero .wrap { position: relative; z-index: 1; }

.hero-badge {
  display: inline-flex; align-items: center; gap: .4rem;
  background: var(--orange-bg); border: 1px solid var(--orange-ring);
  color: var(--orange); font-size: .68rem; font-weight: 700;
  letter-spacing: .1em; text-transform: uppercase;
  padding: .38rem .9rem; border-radius: 100px; margin-bottom: 1.4rem;
}
.hero-badge .dot {
  width: 6px; height: 6px; border-radius: 50%; background: var(--orange);
  animation: blink 1.8s ease-in-out infinite;
}

.hero-title {
  font-family: var(--font-display);
  font-size: clamp(2.3rem,5vw,4.2rem);
  font-weight: 700; line-height: 1.1;
  color: var(--navy); margin-bottom: 1.2rem; letter-spacing: -.02em;
}
.hero-title em { font-style: italic; color: var(--orange); }

.hero-desc { font-size: 1rem; color: var(--text-muted); line-height: 1.8; margin-bottom: 2.2rem; max-width: 440px; }

.hero-btns { display: flex; gap: .7rem; flex-wrap: wrap; margin-bottom: 2.8rem; }

.hero-stats { display: flex; align-items: center; gap: 1.6rem; flex-wrap: wrap; }
.hstat { display: flex; flex-direction: column; }
.hstat-n { font-family: var(--font-display); font-size: 1.6rem; font-weight: 700; color: var(--navy); line-height: 1; }
.hstat-l { font-size: .64rem; color: var(--text-faint); text-transform: uppercase; letter-spacing: .07em; margin-top: 2px; }
.hstat-div { width: 1px; height: 36px; background: var(--border); }

/* hero visual */
.hero-visual { position: relative; }
.hero-img-wrap {
  border-radius: var(--r-xl); overflow: hidden;
  aspect-ratio: 4/5; background: var(--bg-muted);
  box-shadow: var(--sh-lg);
}
.hero-img-wrap img { width: 100%; height: 100%; object-fit: cover; }
.hero-img-wrap .placeholder-img {
  width: 100%; height: 100%; display: flex; align-items: center;
  justify-content: center; flex-direction: column; gap: .5rem;
  color: var(--text-faint); font-size: 3rem;
  background: linear-gradient(135deg, #f0ede8 0%, #e8e4dd 100%);
}
.hero-img-wrap .placeholder-img p { font-size: .78rem; letter-spacing: .1em; text-transform: uppercase; }

.hero-card {
  position: absolute; bottom: 1.5rem; left: 1.5rem;
  background: rgba(255,255,255,.96); backdrop-filter: blur(12px);
  border-radius: var(--r-lg); padding: 1rem 1.3rem;
  box-shadow: var(--sh-md);
}
.hero-card .hc-l { font-size: .62rem; letter-spacing: .12em; text-transform: uppercase; color: var(--text-faint); margin-bottom: .25rem; }
.hero-card .hc-v { font-family: var(--font-display); font-size: 1.6rem; font-weight: 700; color: var(--orange); line-height: 1; }

.hero-float {
  position: absolute; top: 1.8rem; right: -1.2rem;
  background: rgba(255,255,255,.96); backdrop-filter: blur(12px);
  border-radius: var(--r-lg); padding: .8rem 1rem;
  display: flex; align-items: center; gap: .65rem; box-shadow: var(--sh-md);
}
.hero-float .hf-ic {
  width: 34px; height: 34px; border-radius: 50%;
  background: var(--orange-bg); display: flex; align-items: center; justify-content: center;
  font-size: .9rem; flex-shrink: 0;
}
.hero-float .hf-l { font-size: .62rem; color: var(--text-faint); text-transform: uppercase; letter-spacing: .07em; }
.hero-float .hf-v { font-size: .8rem; font-weight: 600; color: var(--navy); }

/* ═══════════════════════════════════════════════════════
   TRUST STRIP
═══════════════════════════════════════════════════════ */
.trust-strip {
  background: #fff; border-top: 1px solid var(--border); border-bottom: 1px solid var(--border);
  padding: 1.4rem 0;
}
.trust-strip .inner {
  display: flex; align-items: center; justify-content: center;
  gap: 2.5rem; flex-wrap: wrap;
}
.trust-item { display: flex; align-items: center; gap: .75rem; }
.trust-ic {
  width: 40px; height: 40px; border-radius: 50%;
  background: var(--orange-bg); display: flex; align-items: center; justify-content: center;
  font-size: 1.1rem; flex-shrink: 0;
}
.trust-item .ti-t { font-size: .86rem; font-weight: 600; color: var(--navy); line-height: 1; }
.trust-item .ti-s { font-size: .7rem; color: var(--text-muted); margin-top: 2px; }
.trust-div { width: 1px; height: 34px; background: var(--border); }

/* ═══════════════════════════════════════════════════════
   WHY KAVANA / SAVINGS
═══════════════════════════════════════════════════════ */
.why-section { background: var(--bg-light); }
.why-chart { display: flex; align-items: flex-end; gap: 2.5rem; height: 220px; padding-bottom: .5rem; }
.wbar { flex: 1; display: flex; flex-direction: column; align-items: center; gap: .6rem; height: 100%; justify-content: flex-end; }
.wbar-fill {
  width: 100%; border-radius: var(--r) var(--r) 0 0;
  position: relative; display: flex; align-items: flex-start; justify-content: center;
  padding-top: .5rem;
}
.wbar-fill.others { background: linear-gradient(to top, #ccc9c4, #dedad4); height: 100%; }
.wbar-fill.kavana { background: linear-gradient(to top, var(--orange-dark), var(--orange)); height: 52%; box-shadow: 0 0 24px rgba(232,97,45,.25); }
.wbar-val { font-family: var(--font-display); font-size: .9rem; font-weight: 700; color: var(--navy); }
.wbar-fill.kavana .wbar-val { color: #fff; }
.wbar-lbl { font-size: .73rem; font-weight: 500; color: var(--text-muted); text-align: center; }

.why-list { display: flex; flex-direction: column; gap: 1.2rem; margin-top: 1.8rem; }
.why-item { display: flex; align-items: flex-start; gap: .9rem; }
.why-ic {
  width: 36px; height: 36px; border-radius: var(--r);
  background: var(--orange-bg); border: 1px solid var(--orange-ring);
  display: flex; align-items: center; justify-content: center;
  font-size: .9rem; flex-shrink: 0; margin-top: 2px;
}
.why-t { font-size: .88rem; font-weight: 600; color: var(--navy); margin-bottom: .2rem; }
.why-d { font-size: .8rem; color: var(--text-muted); line-height: 1.7; }

/* ═══════════════════════════════════════════════════════
   COMPARISON TABLE
═══════════════════════════════════════════════════════ */
.cmp-section { background: #fff; }
.cmp-table-wrap {
  margin-top: 2.5rem; border-radius: var(--r-lg);
  border: 1px solid var(--border); overflow: hidden; box-shadow: var(--sh-xs);
}
.cmp-table { width: 100%; border-collapse: collapse; min-width: 540px; }
.cmp-table th {
  padding: .9rem 1.3rem; text-align: left;
  font-size: .67rem; letter-spacing: .15em; text-transform: uppercase;
  font-weight: 700; border-bottom: 2px solid var(--border); background: var(--bg-light);
}
.cmp-table th:last-child { background: var(--orange-bg); color: var(--orange); }
.cmp-table td {
  padding: .85rem 1.3rem; font-size: .85rem;
  border-bottom: 1px solid var(--border); color: var(--text-dark);
}
.cmp-table tr:last-child td { border-bottom: none; }
.cmp-table td:first-child { color: var(--text-muted); font-size: .8rem; font-weight: 500; }
.cmp-table td:nth-child(2) { color: var(--text-muted); }
.cmp-table td:last-child { background: rgba(232,97,45,.03); color: var(--orange); font-weight: 600; }
.cmp-table tr:hover td { background: var(--bg-light); }
.cmp-table tr:hover td:last-child { background: var(--orange-bg); }
.cmp-ok { color: var(--green); font-weight: 600; }
.cmp-no { color: #bbb; }

/* ═══════════════════════════════════════════════════════
   SERVICES
═══════════════════════════════════════════════════════ */
.services-section { background: var(--bg-light); }
.svc-grid { display: grid; grid-template-columns: repeat(4,1fr); gap: 1.1rem; margin-top: 2.5rem; }
.svc-card {
  background: #fff; border: 1.5px solid var(--border); border-radius: var(--r-xl);
  padding: 1.7rem 1.4rem; position: relative; overflow: hidden;
  transition: all var(--t) var(--ease);
}
.svc-card::after {
  content: ''; position: absolute; bottom: 0; left: 0; right: 0;
  height: 3px; background: var(--orange); transform: scaleX(0);
  transition: transform var(--t) var(--ease);
}
.svc-card:hover { transform: translateY(-4px); box-shadow: var(--sh-md); border-color: transparent; }
.svc-card:hover::after { transform: scaleX(1); }
.svc-icon { font-size: 2rem; margin-bottom: .9rem; display: block; }
.svc-title { font-family: var(--font-display); font-size: 1.05rem; font-weight: 600; color: var(--navy); margin-bottom: .4rem; }
.svc-desc { font-size: .79rem; color: var(--text-muted); line-height: 1.7; }

/* ═══════════════════════════════════════════════════════
   PROCESS
═══════════════════════════════════════════════════════ */
.process-section { background: var(--bg-dark); }
.process-section .heading { color: #fff; }
.process-section .heading em { color: #f5a623; }
.process-section .subtext { color: rgba(255,255,255,.55); }
.process-steps { display: grid; grid-template-columns: repeat(5,1fr); gap: 0; margin-top: 3rem; position: relative; }
.process-steps::before {
  content: ''; position: absolute; top: 24px; left: 10%; right: 10%;
  height: 1px; background: rgba(255,255,255,.1);
}
.proc-step { display: flex; flex-direction: column; align-items: center; text-align: center; gap: .9rem; padding: 0 .5rem; position: relative; }
.proc-num {
  width: 48px; height: 48px; border-radius: 50%;
  background: rgba(255,255,255,.07); border: 1.5px solid rgba(255,255,255,.18);
  display: flex; align-items: center; justify-content: center;
  font-family: var(--font-display); font-size: .95rem; font-weight: 700; color: #f5a623;
  position: relative; z-index: 1; transition: all var(--t);
}
.proc-step:hover .proc-num { background: var(--orange); border-color: var(--orange); color: #fff; }
.proc-title { font-size: .82rem; font-weight: 600; color: #fff; line-height: 1.3; }
.proc-desc { font-size: .73rem; color: rgba(255,255,255,.45); line-height: 1.6; }

/* ═══════════════════════════════════════════════════════
   TESTIMONIALS
═══════════════════════════════════════════════════════ */
.testi-section { background: var(--bg-light); }
.testi-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 1.2rem; margin-top: 2.5rem; }
.testi-card {
  background: #fff; border: 1.5px solid var(--border); border-radius: var(--r-xl); padding: 1.7rem;
  transition: box-shadow var(--t), border-color var(--t);
}
.testi-card:hover { box-shadow: var(--sh-sm); border-color: var(--orange-ring); }
.testi-stars { color: #f5a623; font-size: .82rem; margin-bottom: .9rem; letter-spacing: .1em; }
.testi-quote {
  font-family: var(--font-display); font-size: .97rem; font-style: italic;
  color: var(--text-dark); line-height: 1.75; margin-bottom: 1.2rem;
}
.testi-author { display: flex; align-items: center; gap: .75rem; }
.testi-av {
  width: 38px; height: 38px; border-radius: 50%; background: var(--orange);
  color: #fff; display: flex; align-items: center; justify-content: center;
  font-family: var(--font-display); font-size: .95rem; font-weight: 700; flex-shrink: 0;
}
.testi-name { font-size: .84rem; font-weight: 600; color: var(--navy); }
.testi-loc { font-size: .72rem; color: var(--text-muted); }
.testi-saved {
  margin-left: auto; font-size: .68rem; letter-spacing: .07em; text-transform: uppercase;
  color: var(--green); background: rgba(39,174,96,.1); border: 1px solid rgba(39,174,96,.2);
  padding: .18rem .56rem; border-radius: 100px; font-weight: 600; white-space: nowrap;
}

/* ═══════════════════════════════════════════════════════
   PRICING
═══════════════════════════════════════════════════════ */
.pricing-section { background: #fff; }
.price-tabs {
  display: flex; gap: .35rem; justify-content: center; margin-bottom: 2.5rem;
  background: var(--bg-light); padding: .3rem; border-radius: 100px;
  width: fit-content; margin-inline: auto; border: 1px solid var(--border);
}
.ptab {
  padding: .5rem 1.3rem; font-size: .78rem; font-weight: 600; border-radius: 100px;
  color: var(--text-muted); transition: all var(--t); cursor: pointer; border: none; background: transparent;
}
.ptab.active { background: var(--orange); color: #fff; }
.price-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 1.4rem; align-items: start; }
.price-card {
  background: #fff; border: 1.5px solid var(--border); border-radius: var(--r-xl);
  padding: 2rem; position: relative; box-shadow: var(--sh-xs);
  transition: transform var(--t), box-shadow var(--t);
}
.price-card:hover { transform: translateY(-4px); box-shadow: var(--sh-md); }
.price-card.featured { border-color: var(--orange); box-shadow: 0 0 0 1px var(--orange), var(--sh-md); }
.price-card.featured::before {
  content: 'Most Popular'; position: absolute; top: -1px; left: 50%; transform: translateX(-50%);
  background: var(--orange); color: #fff; font-size: .63rem; font-weight: 700;
  letter-spacing: .12em; text-transform: uppercase; padding: .25rem .9rem; border-radius: 0 0 8px 8px;
}
.pc-tier { font-size: .65rem; letter-spacing: .18em; text-transform: uppercase; color: var(--orange); margin-bottom: .45rem; font-weight: 700; }
.pc-name { font-family: var(--font-display); font-size: 1.55rem; font-weight: 700; color: var(--navy); margin-bottom: .4rem; }
.pc-price { display: flex; align-items: baseline; gap: .15rem; margin-bottom: .3rem; }
.pc-cur { font-size: .95rem; color: var(--navy); font-weight: 600; }
.pc-amt { font-family: var(--font-display); font-size: 2.4rem; font-weight: 700; color: var(--navy); line-height: 1; }
.pc-unit { font-size: .75rem; color: var(--text-muted); }
.pc-compare { font-size: .74rem; color: var(--text-faint); text-decoration: line-through; margin-bottom: 1.1rem; }
.pc-sep { height: 1px; background: var(--border); margin-bottom: 1.1rem; }
.pc-features { display: flex; flex-direction: column; gap: .6rem; margin-bottom: 1.5rem; }
.pc-feat { display: flex; align-items: center; gap: .6rem; font-size: .8rem; color: var(--text-dark); }
.pc-feat .ok { color: var(--green); flex-shrink: 0; font-size: .82rem; }
.pc-feat .no { color: #ccc; flex-shrink: 0; }

/* ═══════════════════════════════════════════════════════
   DESIGNS GALLERY
═══════════════════════════════════════════════════════ */
.designs-section { background: var(--bg-light); }
.design-filters { display: flex; gap: .45rem; flex-wrap: wrap; margin-bottom: 1.8rem; }
.filter-btn {
  padding: .46rem 1rem; font-size: .76rem; font-weight: 500;
  color: var(--text-muted); border: 1.5px solid var(--border); border-radius: 100px;
  background: #fff; transition: all var(--t); cursor: pointer;
}
.filter-btn:hover, .filter-btn.active { background: var(--orange); border-color: var(--orange); color: #fff; }
.designs-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 1.1rem; }
.design-card {
  position: relative; border-radius: var(--r-lg); overflow: hidden;
  background: var(--bg-muted); aspect-ratio: 4/3; cursor: pointer;
  transition: transform var(--t), box-shadow var(--t);
}
.design-card:hover { transform: translateY(-4px); box-shadow: var(--sh-md); }
.design-card:first-child, .design-card:nth-child(4) { grid-column: span 2; aspect-ratio: 16/9; }
.design-card img { width: 100%; height: 100%; object-fit: cover; transition: transform .5s; }
.design-card:hover img { transform: scale(1.04); }
.design-card .dc-ph {
  width: 100%; height: 100%; display: flex; flex-direction: column;
  align-items: center; justify-content: center; gap: .4rem;
  font-size: 2.5rem; color: var(--text-faint);
  background: linear-gradient(135deg, #f0ede8, #e8e4dd);
}
.design-card .dc-ph p { font-size: .7rem; text-transform: uppercase; letter-spacing: .1em; }
.dc-overlay {
  position: absolute; inset: 0;
  background: linear-gradient(to top, rgba(28,43,58,.75) 0%, transparent 55%);
  opacity: 0; transition: opacity var(--t); display: flex; align-items: flex-end; padding: 1rem;
}
.design-card:hover .dc-overlay { opacity: 1; }
.dc-tag { font-size: .62rem; letter-spacing: .12em; text-transform: uppercase; color: rgba(255,255,255,.7); margin-bottom: .2rem; }
.dc-name { font-family: var(--font-display); font-size: 1.05rem; font-weight: 600; color: #fff; }

/* ═══════════════════════════════════════════════════════
   FAQ
═══════════════════════════════════════════════════════ */
.faq-section { background: #fff; }
.faq-list { max-width: 700px; margin: 2.5rem auto 0; display: flex; flex-direction: column; gap: .5rem; }
.faq-item { border: 1px solid var(--border); border-radius: var(--r); overflow: hidden; background: #fff; }
.faq-q {
  width: 100%; display: flex; align-items: center; justify-content: space-between; gap: 1rem;
  padding: 1rem 1.2rem; text-align: left; font-size: .87rem; font-weight: 600; color: var(--navy);
  transition: color var(--t); cursor: pointer; background: none; border: none;
}
.faq-q:hover { color: var(--orange); }
.faq-icon {
  width: 24px; height: 24px; border: 1.5px solid var(--border); border-radius: var(--r);
  display: flex; align-items: center; justify-content: center; font-size: 1rem;
  color: var(--orange); flex-shrink: 0; transition: all var(--t); background: var(--bg-light);
}
.faq-item.open .faq-icon { background: var(--orange); color: #fff; transform: rotate(45deg); border-color: var(--orange); }
.faq-a { display: none; font-size: .85rem; color: var(--text-muted); line-height: 1.8; padding: 0 1.2rem 1.2rem; }
.faq-item.open .faq-a { display: block; }

/* ═══════════════════════════════════════════════════════
   CTA / LEAD FORM SECTION
═══════════════════════════════════════════════════════ */
.lead-section { background: var(--bg-dark); }
.lead-section .eyebrow { color: #f5a623; }
.lead-section .eyebrow::before { background: #f5a623; }
.lead-section .heading { color: #fff; }
.lead-section .heading em { color: #f5a623; }
.lead-section .subtext { color: rgba(255,255,255,.55); }
.lead-section .rule { background: #f5a623; }
.lead-col-info { display: flex; flex-direction: column; gap: .9rem; margin-top: 1.8rem; }
.lead-perk { display: flex; align-items: center; gap: .7rem; font-size: .86rem; color: rgba(255,255,255,.75); }
.lead-perk .lp-ic { color: #f5a623; flex-shrink: 0; font-size: 1rem; }
.lead-form-box {
  background: #fff; border-radius: var(--r-xl); padding: 2.3rem;
  box-shadow: var(--sh-lg);
}
.lead-form-box h3 { font-family: var(--font-display); font-size: 1.45rem; font-weight: 700; color: var(--navy); margin-bottom: .3rem; }
.lead-form-box > p { font-size: .82rem; color: var(--text-muted); margin-bottom: 1.6rem; }

/* ═══════════════════════════════════════════════════════
   FORMS
═══════════════════════════════════════════════════════ */
.fg { margin-bottom: .9rem; }
.fg label {
  display: block; font-size: .7rem; font-weight: 700;
  letter-spacing: .09em; text-transform: uppercase; color: var(--navy); margin-bottom: .38rem;
}
.fg input, .fg select, .fg textarea {
  width: 100%; padding: .74rem .95rem;
  background: var(--bg-light); border: 1.5px solid var(--border); border-radius: var(--r);
  color: var(--text-dark); font-size: .87rem; outline: none;
  transition: border-color var(--t), box-shadow var(--t); -webkit-appearance: none; appearance: none;
}
.fg input::placeholder, .fg textarea::placeholder { color: var(--text-faint); }
.fg input:focus, .fg select:focus, .fg textarea:focus {
  border-color: var(--orange); box-shadow: 0 0 0 3px var(--orange-ring); background: #fff;
}
.fg select {
  cursor: pointer;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%23767676' stroke-width='1.5' fill='none' stroke-linecap='round'/%3E%3C/svg%3E");
  background-repeat: no-repeat; background-position: right .95rem center; padding-right: 2.4rem;
}
.fg textarea { resize: vertical; }
.fg-row { display: grid; grid-template-columns: 1fr 1fr; gap: .75rem; }
.form-note { font-size: .68rem; color: var(--text-faint); margin-top: .65rem; line-height: 1.5; }
.form-feedback {
  padding: .7rem .95rem; border-radius: var(--r); font-size: .84rem;
  margin-top: .7rem; display: none;
}

/* ═══════════════════════════════════════════════════════
   CALCULATOR
═══════════════════════════════════════════════════════ */
.calc-section { background: var(--bg-light); }
.calc-wrap {
  background: #fff; border: 1.5px solid var(--border); border-radius: var(--r-xl);
  overflow: hidden; margin-top: 2.5rem; box-shadow: var(--sh-sm);
}
.calc-head {
  background: var(--bg-dark); padding: 1.4rem 2rem;
  display: flex; align-items: center; justify-content: space-between;
}
.calc-head h3 { font-family: var(--font-display); font-size: 1.2rem; font-weight: 600; color: #fff; }
.calc-head span { font-size: .73rem; color: rgba(255,255,255,.4); }
.calc-body { display: grid; grid-template-columns: 1fr 340px; }
.calc-inputs { padding: 1.8rem; }
.calc-result { padding: 1.8rem; background: var(--orange-bg); border-left: 1.5px solid var(--orange-ring); display: flex; flex-direction: column; justify-content: center; gap: .8rem; }
.calc-field { margin-bottom: 1.4rem; }
.calc-field label { display: block; font-size: .68rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: var(--navy); margin-bottom: .65rem; }
.calc-opts { display: flex; gap: .45rem; flex-wrap: wrap; }
.calc-opt {
  padding: .46rem .9rem; font-size: .8rem; font-weight: 500;
  border: 1.5px solid var(--border); border-radius: var(--r);
  color: var(--text-muted); background: #fff; cursor: pointer;
  transition: all var(--t);
}
.calc-opt:hover { border-color: var(--orange); color: var(--orange); }
.calc-opt.selected { background: var(--orange); border-color: var(--orange); color: #fff; }
.calc-checks { display: grid; grid-template-columns: 1fr 1fr; gap: .45rem; }
.calc-chk {
  display: flex; align-items: center; gap: .55rem;
  padding: .5rem .7rem; border: 1.5px solid var(--border); border-radius: var(--r);
  cursor: pointer; font-size: .78rem; color: var(--text-muted); background: #fff;
  transition: all var(--t);
}
.calc-chk.checked { border-color: var(--orange); color: var(--navy); background: var(--orange-bg); }
.cb-box {
  width: 15px; height: 15px; border: 1.5px solid var(--border); border-radius: 3px;
  display: flex; align-items: center; justify-content: center;
  font-size: .58rem; flex-shrink: 0; background: #fff; transition: all var(--t);
}
.calc-chk.checked .cb-box { background: var(--orange); border-color: var(--orange); color: #fff; }
.r-label { font-size: .68rem; letter-spacing: .12em; text-transform: uppercase; color: var(--text-muted); font-weight: 600; }
.r-price { font-family: var(--font-display); font-size: 2.6rem; font-weight: 700; color: var(--orange); line-height: 1; }
.r-save { font-size: .84rem; color: var(--green); font-weight: 600; }
.r-compare { font-size: .78rem; color: var(--text-faint); text-decoration: line-through; }
.r-note { font-size: .72rem; color: var(--text-muted); line-height: 1.6; }
.calc-breakdown { display: flex; flex-direction: column; gap: .45rem; padding: .9rem; background: #fff; border-radius: var(--r); border: 1px solid var(--orange-ring); }
.cbd-row { display: flex; justify-content: space-between; font-size: .78rem; }
.cbd-l { color: var(--text-muted); }
.cbd-v { color: var(--navy); font-weight: 500; }
.cbd-row.total { border-top: 1px solid var(--border); padding-top: .45rem; margin-top: .2rem; }
.cbd-row.total .cbd-l, .cbd-row.total .cbd-v { color: var(--orange); font-weight: 700; }

/* ═══════════════════════════════════════════════════════
   EMI STRIP
═══════════════════════════════════════════════════════ */
.emi-strip { background: #fff; border-top: 1px solid var(--border); border-bottom: 1px solid var(--border); padding: 2rem 0; }
.emi-strip .inner { display: flex; align-items: center; justify-content: space-between; gap: 2rem; flex-wrap: wrap; }
.emi-text h3 { font-family: var(--font-display); font-size: 1.5rem; font-weight: 700; color: var(--navy); margin-bottom: .3rem; }
.emi-text p { font-size: .84rem; color: var(--text-muted); }
.emi-banks { display: flex; align-items: center; gap: .55rem; flex-wrap: wrap; }
.bank-badge { background: var(--bg-light); border: 1px solid var(--border); border-radius: var(--r); padding: .4rem .85rem; font-size: .74rem; font-weight: 600; color: var(--text-muted); }

/* ═══════════════════════════════════════════════════════
   PAGE HERO (inner pages)
═══════════════════════════════════════════════════════ */
.page-hero {
  background: var(--bg-light); padding-block: 4rem 3.5rem;
  border-bottom: 1px solid var(--border);
}
.page-hero h1 {
  font-family: var(--font-display);
  font-size: clamp(2rem,4.5vw,3.6rem); font-weight: 700; line-height: 1.1;
  color: var(--navy); margin-bottom: .7rem; letter-spacing: -.02em;
}
.page-hero h1 em { font-style: italic; color: var(--orange); }
.page-hero p { font-size: .97rem; color: var(--text-muted); max-width: 500px; line-height: 1.8; }
.breadcrumb { display: flex; align-items: center; gap: .38rem; font-size: .74rem; color: var(--text-faint); margin-bottom: 1.4rem; }
.breadcrumb a { color: var(--text-faint); transition: color var(--t); }
.breadcrumb a:hover { color: var(--orange); }

/* ═══════════════════════════════════════════════════════
   CONTACT
═══════════════════════════════════════════════════════ */
.contact-section { background: #fff; }
.contact-info { display: flex; flex-direction: column; gap: 1.5rem; }
.ci-item { display: flex; gap: .95rem; }
.ci-ic { width: 40px; height: 40px; background: var(--orange-bg); border: 1px solid var(--orange-ring); border-radius: var(--r); display: flex; align-items: center; justify-content: center; font-size: .95rem; flex-shrink: 0; }
.ci-l { font-size: .66rem; letter-spacing: .1em; text-transform: uppercase; color: var(--text-faint); margin-bottom: .2rem; font-weight: 600; }
.ci-v { font-size: .88rem; color: var(--text-dark); line-height: 1.6; }
.contact-form-box { background: var(--bg-light); border-radius: var(--r-xl); padding: 2.3rem; border: 1.5px solid var(--border); }
.contact-form-box h3 { font-family: var(--font-display); font-size: 1.45rem; font-weight: 700; color: var(--navy); margin-bottom: .3rem; }

/* ═══════════════════════════════════════════════════════
   FOOTER
═══════════════════════════════════════════════════════ */
#site-footer { background: var(--bg-dark); }
.footer-grid { display: grid; grid-template-columns: 2fr 1fr 1fr 1fr; gap: 3rem; padding: 4rem 0 3rem; border-bottom: 1px solid rgba(255,255,255,.07); }
.ft-brand-name { font-family: var(--font-display); font-size: 1.55rem; font-weight: 700; color: #fff; margin-bottom: .2rem; }
.ft-brand-tag { font-size: .62rem; letter-spacing: .15em; text-transform: uppercase; color: #f5a623; margin-bottom: .95rem; font-weight: 600; }
.ft-brand-desc { font-size: .79rem; color: rgba(255,255,255,.42); line-height: 1.8; max-width: 265px; margin-bottom: 1.4rem; }
.ft-socials { display: flex; gap: .45rem; }
.ft-social {
  width: 34px; height: 34px; border: 1px solid rgba(255,255,255,.14); border-radius: var(--r);
  display: flex; align-items: center; justify-content: center;
  font-size: .84rem; color: rgba(255,255,255,.4); text-decoration: none;
  transition: all var(--t);
}
.ft-social:hover { border-color: var(--orange); color: #fff; background: var(--orange); }
.footer-col h4 { font-size: .63rem; letter-spacing: .18em; text-transform: uppercase; font-weight: 700; color: rgba(255,255,255,.8); margin-bottom: 1.1rem; }
.footer-col ul li { margin-bottom: .6rem; }
.footer-col ul li a { font-size: .79rem; color: rgba(255,255,255,.42); transition: color var(--t); }
.footer-col ul li a:hover { color: #fff; }
.footer-bottom { display: flex; align-items: center; justify-content: space-between; padding: 1.2rem 0; gap: 1rem; flex-wrap: wrap; }
.footer-bottom p { font-size: .73rem; color: rgba(255,255,255,.28); }
.footer-bottom-links { display: flex; gap: 1.4rem; }
.footer-bottom-links a { font-size: .73rem; color: rgba(255,255,255,.28); transition: color var(--t); }
.footer-bottom-links a:hover { color: rgba(255,255,255,.65); }

/* ═══════════════════════════════════════════════════════
   WHATSAPP FLOAT
═══════════════════════════════════════════════════════ */
.wa-btn {
  position: fixed; bottom: 1.5rem; right: 1.5rem; z-index: 999;
  width: 52px; height: 52px; border-radius: 50%;
  background: #25d366; color: #fff;
  display: flex; align-items: center; justify-content: center;
  box-shadow: 0 4px 18px rgba(37,211,102,.4);
  animation: float 3s ease-in-out infinite;
  transition: transform var(--t), box-shadow var(--t);
}
.wa-btn:hover { transform: scale(1.1); box-shadow: 0 8px 28px rgba(37,211,102,.5); animation: none; }

/* ═══════════════════════════════════════════════════════
   EXIT POPUP
═══════════════════════════════════════════════════════ */
.popup-overlay {
  position: fixed; inset: 0; background: rgba(0,0,0,.5);
  z-index: 2000; display: none; align-items: center; justify-content: center;
  backdrop-filter: blur(4px); padding: 1rem;
}
.popup-overlay.open { display: flex; }
.popup-box {
  background: #fff; border-radius: var(--r-xl); padding: 2.4rem;
  max-width: 460px; width: 100%; position: relative;
  animation: popIn .3s var(--ease); box-shadow: var(--sh-lg);
}
.popup-close {
  position: absolute; top: .9rem; right: .9rem;
  width: 28px; height: 28px; border-radius: var(--r);
  display: flex; align-items: center; justify-content: center;
  color: var(--text-muted); font-size: 1rem; cursor: pointer;
  background: var(--bg-light); border: none;
  transition: all var(--t);
}
.popup-close:hover { background: var(--border); color: var(--navy); }
.popup-eyebrow { font-size: .64rem; letter-spacing: .18em; text-transform: uppercase; color: var(--orange); margin-bottom: .7rem; font-weight: 700; }
.popup-box h2 { font-family: var(--font-display); font-size: 1.9rem; font-weight: 700; color: var(--navy); line-height: 1.2; margin-bottom: .7rem; }
.popup-box h2 em { font-style: italic; color: var(--orange); }
.popup-box p { font-size: .85rem; color: var(--text-muted); margin-bottom: 1.2rem; line-height: 1.7; }
.popup-offer { background: var(--orange-bg); border: 1px solid var(--orange-ring); border-radius: var(--r); padding: .95rem 1.1rem; margin-bottom: 1.2rem; display: flex; align-items: center; gap: .85rem; }
.popup-offer .po-ic { font-size: 1.3rem; }
.popup-offer .po-t { font-family: var(--font-display); font-size: .95rem; font-weight: 700; color: var(--navy); }
.popup-offer .po-s { font-size: .73rem; color: var(--text-muted); }

/* ═══════════════════════════════════════════════════════
   404 PAGE
═══════════════════════════════════════════════════════ */
.page-404 {
  min-height: 80vh; display: flex; align-items: center; justify-content: center;
  background: var(--bg-light); padding-block: 6rem;
}
.page-404 .inner { text-align: center; max-width: 560px; margin-inline: auto; }
.err-emoji { font-size: 4.5rem; margin-bottom: 1rem; display: block; }
.err-code { font-family: var(--font-display); font-size: 6rem; font-weight: 700; color: var(--border); line-height: 1; margin-bottom: .4rem; }
.err-title { font-family: var(--font-display); font-size: clamp(1.6rem,3vw,2.4rem); font-weight: 700; color: var(--navy); margin-bottom: .8rem; }
.err-title em { font-style: italic; color: var(--orange); }
.err-msg { font-size: .97rem; color: var(--text-muted); line-height: 1.8; margin-bottom: .9rem; }
.err-funny { font-size: .84rem; color: var(--text-faint); font-style: italic; margin-bottom: 2.2rem; background: var(--orange-bg); border: 1px solid var(--orange-ring); padding: .75rem 1.2rem; border-radius: var(--r-lg); display: inline-block; }
.err-btns { display: flex; gap: .75rem; justify-content: center; flex-wrap: wrap; }

/* ═══════════════════════════════════════════════════════
   BLOG / ARCHIVE
═══════════════════════════════════════════════════════ */
.blog-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 1.2rem; }
.blog-card { background: #fff; border: 1.5px solid var(--border); border-radius: var(--r-xl); overflow: hidden; transition: transform var(--t), box-shadow var(--t); }
.blog-card:hover { transform: translateY(-4px); box-shadow: var(--sh-md); }
.blog-card-img { aspect-ratio: 16/9; overflow: hidden; background: var(--bg-muted); }
.blog-card-img img { width: 100%; height: 100%; object-fit: cover; transition: transform .5s; }
.blog-card:hover .blog-card-img img { transform: scale(1.04); }
.blog-card-body { padding: 1.3rem; }
.bc-cat { font-size: .63rem; letter-spacing: .14em; text-transform: uppercase; color: var(--orange); margin-bottom: .55rem; font-weight: 700; }
.bc-title { font-family: var(--font-display); font-size: 1.05rem; font-weight: 600; color: var(--navy); line-height: 1.4; margin-bottom: .55rem; transition: color var(--t); }
.blog-card:hover .bc-title { color: var(--orange); }
.bc-excerpt { font-size: .78rem; color: var(--text-muted); line-height: 1.7; }

/* WP content */
.entry-content h2,.entry-content h3 { font-family: var(--font-display); color: var(--navy); margin: 1.8rem 0 .75rem; }
.entry-content p { margin-bottom: 1.1rem; color: var(--text-muted); line-height: 1.85; }
.entry-content a { color: var(--orange); text-decoration: underline; text-decoration-color: rgba(232,97,45,.3); }
.entry-content ul,.entry-content ol { padding-left: 1.4rem; margin-bottom: 1.1rem; color: var(--text-muted); }
.entry-content li { margin-bottom: .35rem; }
.entry-content blockquote { border-left: 3px solid var(--orange); padding: .9rem 1.4rem; margin: 1.8rem 0; font-family: var(--font-display); font-size: 1.1rem; font-style: italic; color: var(--text-dark); background: var(--orange-bg); border-radius: 0 var(--r) var(--r) 0; }

/* WP */
.alignleft { float: left; margin: 0 2rem 1rem 0; }
.alignright { float: right; margin: 0 0 1rem 2rem; }
.aligncenter { display: block; margin-inline: auto; }
.screen-reader-text { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0,0,0,0); }

/* ═══════════════════════════════════════════════════════
   ANIMATIONS
═══════════════════════════════════════════════════════ */
@keyframes blink { 0%,100%{opacity:1} 50%{opacity:.35} }
@keyframes float { 0%,100%{transform:translateY(0)} 50%{transform:translateY(-7px)} }
@keyframes popIn { from{opacity:0;transform:scale(.94)} to{opacity:1;transform:scale(1)} }
@keyframes fadeUp { from{opacity:0;transform:translateY(22px)} to{opacity:1;transform:translateY(0)} }

.reveal { opacity: 0; transform: translateY(22px); transition: opacity .6s var(--ease), transform .6s var(--ease); }
.reveal.visible { opacity: 1; transform: translateY(0); }
.delay-1 { transition-delay: .08s; }
.delay-2 { transition-delay: .16s; }
.delay-3 { transition-delay: .24s; }
.delay-4 { transition-delay: .32s; }

/* ═══════════════════════════════════════════════════════
   RESPONSIVE — TABLET 1100px
═══════════════════════════════════════════════════════ */
@media (max-width: 1100px) {
  .hdr-inner { grid-template-columns: 180px 1fr auto; }
  .hero .col-2 { grid-template-columns: 1fr; }
  .hero-visual { display: none; }
  .footer-grid { grid-template-columns: 1fr 1fr; gap: 2rem; padding-block: 3rem 2.5rem; }
  .svc-grid { grid-template-columns: repeat(2,1fr); }
  .why-section .col-2 { grid-template-columns: 1fr; gap: 3rem; }
}

/* ═══════════════════════════════════════════════════════
   RESPONSIVE — 900px (nav hides)
═══════════════════════════════════════════════════════ */
@media (max-width: 900px) {
  .hdr-inner { grid-template-columns: 1fr auto; gap: 0; }
  .hdr-nav { display: none; }
  .desk-cta { display: none; }
  .hdr-burger { display: flex; }
  .calc-body { grid-template-columns: 1fr; }
  .calc-result { border-left: none; border-top: 1.5px solid var(--orange-ring); }
  .contact-section .col-2 { grid-template-columns: 1fr; gap: 2.5rem; }
  .lead-section .col-2 { grid-template-columns: 1fr; gap: 2.5rem; }
  .testi-grid { grid-template-columns: 1fr 1fr; }
  .price-grid { grid-template-columns: 1fr 1fr; }
  .process-steps { grid-template-columns: repeat(3,1fr); gap: 2rem; }
  .process-steps::before { display: none; }
  .blog-grid { grid-template-columns: 1fr 1fr; }
  .emi-strip .inner { flex-direction: column; align-items: flex-start; gap: 1.2rem; }
  .designs-grid .design-card:first-child,
  .designs-grid .design-card:nth-child(4) { grid-column: span 1; aspect-ratio: 4/3; }
}

/* ═══════════════════════════════════════════════════════
   RESPONSIVE — 640px (mobile)
═══════════════════════════════════════════════════════ */
@media (max-width: 640px) {
  :root { --nav-h: 58px; }
  .ann-bar { height: auto; min-height: 32px; font-size: .68rem; padding: .35rem 2.2rem; }
  body.has-ann-bar { padding-top: calc(var(--nav-h) + 32px); }
  .has-ann-bar #site-header { top: 32px; }
  .col-2 { grid-template-columns: 1fr !important; gap: 2rem !important; }
  .col-3, .col-4, .svc-grid, .testi-grid, .price-grid, .blog-grid, .designs-grid { grid-template-columns: 1fr !important; }
  .designs-grid .design-card:first-child,
  .designs-grid .design-card:nth-child(4) { grid-column: span 1; aspect-ratio: 4/3; }
  .process-steps { grid-template-columns: 1fr !important; gap: 1.4rem; }
  .footer-grid { grid-template-columns: 1fr; gap: 1.8rem; padding-block: 2.5rem 2rem; }
  .fg-row { grid-template-columns: 1fr; }
  .calc-checks { grid-template-columns: 1fr; }
  .hero-btns { flex-direction: column; }
  .hero-btns .btn { justify-content: center; }
  .hero-stats { gap: 1rem; }
  .hstat-div { display: none; }
  .trust-div { display: none; }
  .trust-strip .inner { flex-direction: column; align-items: flex-start; gap: .9rem; }
  .footer-bottom { flex-direction: column; text-align: center; }
  .footer-bottom-links { justify-content: center; }
  .popup-box { padding: 1.6rem; }
  .popup-box h2 { font-size: 1.6rem; }
  .err-btns { flex-direction: column; align-items: center; }
  .ann-bar { font-size: .68rem; padding: .4rem 2.2rem; }
  .wa-btn { bottom: .9rem; right: .9rem; width: 48px; height: 48px; }
}
