/* ============================================================
   MEHANDI ART BY PN — style.css
   ============================================================ */

/* ---------- VARIABLES ---------- */
:root {
  --clay:       #C25A1E;
  --rust:       #9B3D12;
  --cream:      #F5ECD7;
  --sand:       #E8D5B0;
  --brown-dark: #2C1A0E;
  --brown-mid:  #4A2C17;
  --moss:       #5C6B3A;
  --sage:       #7A8C4F;
  --warm-white: #FBF5EA;
  --ink:        #1A0F08;
  --wa-green:   #25D366;
}

/* ---------- RESET ---------- */
*, *::before, *::after { margin: 0; padding: 0; box-sizing: border-box; }
html { scroll-behavior: smooth; }

body {
  background: var(--warm-white);
  color: var(--ink);
  font-family: 'Barlow', sans-serif;
  overflow-x: hidden;
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
}

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

/* Prevent layout shift from scrollbar */
html { scrollbar-gutter:stable; }

  

/* ---------- NOISE OVERLAY ---------- */
body::before {
  content: '';
  position: fixed; inset: 0;
  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.04'/%3E%3C/svg%3E");
  pointer-events: none; z-index: 9000; opacity: .6;
}

/* ---------- ANIMATIONS ---------- */
@keyframes fadeSlideUp   { from { opacity:0; transform:translateY(30px); } to { opacity:1; transform:translateY(0); } }
@keyframes slowspin      { to { transform:translateY(-50%) rotate(360deg); } }
@keyframes float         { 0%,100%{ transform:translateY(0) rotate(0deg); } 50%{ transform:translateY(-12px) rotate(45deg); } }
@keyframes marquee       { from { transform:translateX(0); } to { transform:translateX(-50%); } }
@keyframes scrollPulse   { 0%,100%{ opacity:1; transform:scaleY(1); } 50%{ opacity:.4; transform:scaleY(.7); } }
@keyframes spinBadge     { to { transform:rotate(360deg); } }
@keyframes waFloat       { 0%,100%{ transform:translateY(0); } 50%{ transform:translateY(-6px); } }
@keyframes lightboxIn    { from { opacity:0; transform:scale(.92); } to { opacity:1; transform:scale(1); } }
@keyframes countUp       { from { opacity:0; } to { opacity:1; } }

/* ---------- SCROLL REVEAL ---------- */
.reveal        { opacity:0; transform:translateY(40px);   transition: opacity .7s ease, transform .7s ease; }
.reveal-left   { opacity:0; transform:translateX(-40px);  transition: opacity .7s ease, transform .7s ease; }
.reveal-right  { opacity:0; transform:translateX(40px);   transition: opacity .7s ease, transform .7s ease; }
.reveal.visible, .reveal-left.visible, .reveal-right.visible { opacity:1; transform:none; }

@media (prefers-reduced-motion: reduce) {
  .reveal, .reveal-left, .reveal-right { transition: opacity .4s ease; transform: none; }
}

/* ---------- NAVIGATION ---------- */
nav {
  position: fixed; top:0; left:0; right:0; z-index:500;
  padding: 16px 48px;
  display: flex; justify-content: space-between; align-items: center;
  background: rgba(251,245,234,.94);
  backdrop-filter: blur(10px);
  border-bottom: 2px solid var(--clay);
  transition: padding .3s;
}
nav.scrolled { padding: 10px 48px; }
.nav-img{
  width: 36px;
  height: 36px;
  background: var(--cream);
  color: var(--bg-darkest);
  border-radius: var(--r-sm);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 0.85rem;
  font-weight: 900;
  letter-spacing: 0;
  flex-shrink: 0;
}
.nav-logo {
  font-family: 'Bebas Neue', sans-serif;
  font-size: 26px; letter-spacing: 3px;
  color: var(--clay); text-decoration: none; line-height:1;
  display: flex; align-items: center; gap: 8px;
}
.nav-logo img {
  width: 40px;
  height: 40px;
  object-fit: cover;
  border-radius: 4px;
}
.nav-logo span { color: var(--brown-dark); }

.nav-links { display:flex; gap:28px; list-style:none; }
.nav-links a {
  font-family: 'Barlow Condensed', sans-serif;
  font-weight:700; font-size:12px; letter-spacing:2px; text-transform:uppercase;
  color: var(--brown-mid); text-decoration:none; position:relative; transition:color .2s;
}
.nav-links a::after {
  content:''; position:absolute; bottom:-3px; left:0;
  width:0; height:2px; background:var(--clay); transition:width .25s ease;
}
.nav-links a:hover, .nav-links a.active { color:var(--clay); }
.nav-links a:hover::after, .nav-links a.active::after { width:100%; }

/* Hamburger */
.nav-hamburger {
  display:none; flex-direction:column; gap:5px;
  background:none; border:none; cursor:pointer; padding:8px;
  z-index:600;
  width:44px;
  height:44px;
  align-items:center;
  justify-content:center;
  -webkit-tap-highlight-color:transparent;
}
.nav-hamburger span {
  display:block; width:26px; height:2px;
  background:var(--brown-dark); transition:all .3s ease;
}
.nav-hamburger.open span:nth-child(1){ transform:translateY(7px) rotate(45deg); }
.nav-hamburger.open span:nth-child(2){ opacity:0; }
.nav-hamburger.open span:nth-child(3){ transform:translateY(-7px) rotate(-45deg); }
.nav-hamburger:active { opacity:.7; }

/* Mobile menu */
.mobile-menu {
  display:none; position:fixed;
  top:0; left:0; right:0; bottom:0;
  background:var(--warm-white);
  z-index:400; flex-direction:column;
  justify-content:center; align-items:center; gap:36px;
  padding-bottom:60px;
  max-height:100vh;
  overflow-y:auto;
  -webkit-overflow-scrolling:touch;
}
.mobile-menu.open { 
  display:flex; 
  animation:slideDown .3s ease-out;
}
.mobile-menu a {
  font-family:'Bebas Neue', sans-serif; font-size:42px; letter-spacing:3px;
  color:var(--brown-dark); text-decoration:none; transition:color .2s;
  padding:12px;
  min-height:48px;
  display:flex;
  align-items:center;
  -webkit-tap-highlight-color:transparent;
}
.mobile-menu a:active { color:var(--clay); }

@keyframes slideDown {
  from { opacity:0; transform:translateY(-20px); }
  to { opacity:1; transform:translateY(0); }
}

/* ---------- HERO ---------- */
#hero {
  min-height:100vh;
  display:grid; grid-template-columns:1fr 1fr;
  position:relative; padding-top:80px; overflow:hidden;
}
.hero-bg-pattern {
  position:absolute; inset:0;
  background-image:
    radial-gradient(circle at 20% 50%, rgba(194,90,30,.08) 0%, transparent 50%),
    radial-gradient(circle at 80% 20%, rgba(92,107,58,.08) 0%, transparent 40%);
}
.mandala-bg {
  position:absolute; right:-80px; top:50%;
  transform:translateY(-50%);
  width:600px; height:600px;
  opacity:.05; animation:slowspin 60s linear infinite;
  will-change: transform;
}
.hero-left {
  display:flex; flex-direction:column; justify-content:center;
  padding:80px 60px 80px 80px; position:relative; z-index:2;
}
.hero-tag {
  display:inline-block;
  font-family:'Barlow Condensed', sans-serif; font-size:11px;
  font-weight:700; letter-spacing:4px; text-transform:uppercase;
  color:var(--clay); border:2px solid var(--clay);
  padding:6px 14px; margin-bottom:28px; width:fit-content;
  animation:fadeSlideUp .6s ease both;
}
.hero-title {
  font-family:'Bebas Neue', sans-serif;
  font-size:clamp(68px,8.5vw,128px); line-height:.9;
  color:var(--brown-dark); letter-spacing:2px;
  animation:fadeSlideUp .7s .1s ease both;
}
.hero-title .accent  { color:var(--clay); display:block; }
.hero-title .stroke  { -webkit-text-stroke:3px var(--brown-dark); color:transparent; display:block; }
.hero-sub {
  font-size:16px; line-height:1.7; color:var(--brown-mid);
  margin-top:24px; max-width:380px;
  animation:fadeSlideUp .7s .2s ease both;
}
.hero-cta {
  display:flex; gap:16px; flex-wrap:wrap; margin-top:36px;
  animation:fadeSlideUp .7s .3s ease both;
}
.hero-stats {
  display:flex; gap:36px; margin-top:48px; flex-wrap:wrap;
  animation:fadeSlideUp .7s .4s ease both;
}
.stat-num { font-family:'Bebas Neue',sans-serif; font-size:42px; color:var(--clay); line-height:1; }
.stat-label { font-size:11px; letter-spacing:1.5px; text-transform:uppercase; color:var(--brown-mid); font-weight:600; margin-top:2px; }

.hero-right {
  display:flex; align-items:center; justify-content:center;
  position:relative; z-index:2; padding:60px 60px 60px 20px;
}
.hero-img-wrap {
  position:relative; width:380px;
  animation:fadeSlideUp .8s .15s ease both;
}
.hero-img-wrap::before {
  content:''; position:absolute; inset:-12px -12px 12px 12px;
  border:3px solid var(--clay); z-index:-1;
}
.hero-img-wrap::after {
  content:'EST. 2025'; position:absolute; bottom:-20px; right:-20px;
  background:var(--brown-dark); color:var(--cream);
  font-family:'Bebas Neue',sans-serif; font-size:17px; letter-spacing:3px; padding:10px 18px;
}
.hero-img-main {
  width:100%; aspect-ratio:3/4;
  background:var(--sand); display:flex; align-items:center; justify-content:center;
  position:relative; overflow:hidden;
}

.artist-photo{
  position:absolute;
  width:70%;
  bottom:10%;
  left:50%;
  transform:translateX(-50%);
  border-radius:12px;
  box-shadow:0 10px 25px rgba(0,0,0,0.3);
  z-index:2;
}

.mehandi-svg{
  position:relative;
  z-index:1;
}
.mehandi-svg { width:85%; opacity:.85; }

.scroll-hint {
  position:absolute; bottom:30px; left:50%; transform:translateX(-50%);
  display:flex; flex-direction:column; align-items:center; gap:8px;
  font-family:'Barlow Condensed',sans-serif; font-size:11px; letter-spacing:3px;
  text-transform:uppercase; color:var(--clay);
  animation:fadeSlideUp 1s .8s both;
}
.scroll-line { width:2px; height:40px; background:linear-gradient(to bottom,var(--clay),transparent); animation:scrollPulse 1.5s ease infinite; }

/* ---------- BUTTONS ---------- */
.btn-primary {
  background:var(--clay); color:#fff;
  font-family:'Barlow Condensed',sans-serif; font-weight:700;
  font-size:14px; letter-spacing:2px; text-transform:uppercase;
  padding:15px 32px; border:none; text-decoration:none; display:inline-flex;
  align-items:center; gap:8px; min-height:50px;
  transition:background .2s, transform .15s;
  clip-path:polygon(0 0, calc(100% - 12px) 0, 100% 12px, 100% 100%, 12px 100%, 0 calc(100% - 12px));
  -webkit-tap-highlight-color:transparent;
}
.btn-primary:hover { background:var(--rust); transform:translateY(-2px); }
.btn-primary:active { transform:translateY(0); }

.btn-outline {
  border:2px solid var(--brown-dark); color:var(--brown-dark);
  font-family:'Barlow Condensed',sans-serif; font-weight:700;
  font-size:14px; letter-spacing:2px; text-transform:uppercase;
  padding:13px 28px; text-decoration:none; display:inline-flex;
  align-items:center; gap:8px; min-height:50px; transition:all .2s;
  -webkit-tap-highlight-color:transparent;
}
.btn-outline:hover { background:var(--brown-dark); color:var(--warm-white); }
.btn-outline:active { transform:scale(.98); }

.btn-wa {
  background:var(--wa-green); color:#fff;
  font-family:'Barlow Condensed',sans-serif; font-weight:700;
  font-size:14px; letter-spacing:2px; text-transform:uppercase;
  padding:15px 32px; border:none; text-decoration:none; display:inline-flex;
  align-items:center; gap:10px; min-height:50px; transition:all .2s;
  clip-path:polygon(0 0, calc(100% - 12px) 0, 100% 12px, 100% 100%, 12px 100%, 0 calc(100% - 12px));
  -webkit-tap-highlight-color:transparent;
}
.btn-wa:hover { background:#1da851; transform:translateY(-2px); }
.btn-wa:active { transform:translateY(0); }

/* Touch-friendly link sizes */
a { -webkit-tap-highlight-color:rgba(0,0,0,0.1); }
.nav-links a, footer a, .footer-links a { min-height:44px; padding:8px 16px; display:inline-flex; align-items:center; }
.gallery-item, .insta-item, .service-card, .why-card, .testi-card { cursor:pointer; -webkit-user-select:none; user-select:none; }

/* Form inputs - min 44px touch target */
.form-input,
.form-select,
.form-textarea,
.form-label {
  touch-action:manipulation;
}

/* Hamburger - 44px+ touch target */
.nav-hamburger {
  display:none; flex-direction:column; gap:5px;
  background:none; border:none; cursor:pointer; padding:8px;
  z-index:600;
  width:44px;
  height:44px;
  display:flex;
  align-items:center;
  justify-content:center;
}

/* Mobile menu links - 44px touch target */
.mobile-menu a {
  font-family:'Bebas Neue', sans-serif; font-size:42px; letter-spacing:3px;
  color:var(--brown-dark); text-decoration:none; transition:color .2s;
  padding:12px;
  min-height:48px;
  display:flex;
  align-items:center;
}

/* ---------- MARQUEE ---------- */
.marquee-strip { background:var(--brown-dark); padding:14px 0; overflow:hidden; }
.marquee-inner { display:flex; white-space:nowrap; animation:marquee 25s linear infinite; width:max-content; }
.marquee-item  { font-family:'Bebas Neue',sans-serif; font-size:22px; letter-spacing:4px; color:var(--cream); padding:0 40px; }
.marquee-item span { color:var(--clay); margin:0 8px; }

/* ---------- SECTION COMMONS ---------- */
section { padding:100px 80px; }

.section-tag {
  font-family:'Barlow Condensed',sans-serif; font-size:11px; font-weight:700;
  letter-spacing:5px; text-transform:uppercase; color:var(--clay);
  margin-bottom:12px; display:flex; align-items:center; gap:12px;
}
.section-tag::before { content:''; width:32px; height:2px; background:var(--clay); display:inline-block; flex-shrink:0; }

.section-title {
  font-family:'Bebas Neue',sans-serif;
  font-size:clamp(52px,6vw,88px); line-height:.92; letter-spacing:1px;
  color:var(--brown-dark); margin-bottom:60px;
}

/* ---------- BASIC PRICING ---------- */
.basic-pricing { background:var(--warm-white); }
.basic-pricing .section-tag { color:var(--clay); }
.basic-pricing .section-tag::before { background:var(--clay); }
.basic-pricing .section-title { color:var(--brown-dark); margin-bottom:16px; }

.section-sub {
  font-size:16px; color:var(--brown-mid); line-height:1.7;
  margin-bottom:48px; max-width:600px;
}

.pricing-grid {
  display:grid; grid-template-columns:repeat(5,1fr); gap:16px;
  margin-bottom:32px;
}

.pricing-card {
  background:#fff; border:2px solid var(--sand);
  padding:28px 24px; text-align:center;
  transition:all .3s ease;
  position:relative; overflow:hidden;
}

.pricing-card::before {
  content:''; position:absolute; inset:0; background:var(--sand);
  transform:scaleY(0); transform-origin:bottom;
  transition:transform .3s ease; z-index:0;
}

.pricing-card:hover::before { transform:scaleY(1); }
.pricing-card:hover { transform:translateY(-4px); border-color:var(--clay); }
.pricing-card > * { position:relative; z-index:1; }

.pricing-card h3 {
  font-family:'Barlow Condensed',sans-serif; font-weight:700;
  font-size:16px; letter-spacing:1px; text-transform:uppercase;
  color:var(--brown-dark); margin-bottom:16px; transition:color .3s;
}

.pricing-card:hover h3 { color:var(--clay); }

.pricing-card .price {
  font-family:'Bebas Neue',sans-serif; font-size:42px;
  color:var(--clay); letter-spacing:1px; margin:0;
  transition:color .3s;
}

.pricing-card:hover .price { color:var(--brown-dark); }

.pricing-note {
  font-size:13px; color:var(--brown-mid); font-style:italic;
  text-align:center; margin-top:0;
}

/* ---------- SERVICES ---------- */
#services { background:var(--brown-dark); }
#services .section-tag { color:var(--clay); }
#services .section-tag::before { background:var(--clay); }
#services .section-title { color:var(--cream); }

.services-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:2px; }

.service-card {
  background:var(--brown-mid); padding:40px 32px;
  position:relative; overflow:hidden; transition:transform .3s ease;
  cursor:pointer;
}
.service-card::before {
  content:''; position:absolute; inset:0; background:var(--clay);
  transform:scaleY(0); transform-origin:bottom;
  transition:transform .35s ease; z-index:0;
}
.service-card:hover::before { transform:scaleY(1); }
.service-card:hover { transform:translateY(-4px); }
.service-card > * { position:relative; z-index:1; }

.service-num {
  font-family:'Bebas Neue',sans-serif; font-size:72px; line-height:1;
  color:rgba(255,255,255,.07); position:absolute; top:16px; right:20px; z-index:0;
  transition:color .35s;
}
.service-card:hover .service-num { color:rgba(255,255,255,.14); }

.service-icon  { font-size:32px; margin-bottom:20px; display:block; }
.service-name  { font-family:'Bebas Neue',sans-serif; font-size:32px; letter-spacing:1px; color:var(--cream); margin-bottom:10px; transition:color .35s; line-height:1.1; }
.service-card:hover .service-name { color:#fff; }
.service-desc  { font-size:14px; color:rgba(245,236,215,.6); line-height:1.7; margin-bottom:24px; transition:color .35s; }
.service-card:hover .service-desc { color:rgba(255,255,255,.85); }
.service-price { font-family:'Bebas Neue',sans-serif; font-size:38px; color:var(--clay); letter-spacing:1px; transition:color .35s; }
.service-card:hover .service-price { color:#fff; }
.service-price small { font-family:'Barlow Condensed',sans-serif; font-size:14px; font-weight:600; letter-spacing:1px; }

.service-badge {
  position:absolute; top:20px; left:20px; background:var(--clay);
  color:#fff; font-family:'Barlow Condensed',sans-serif; font-weight:700;
  font-size:10px; letter-spacing:2px; text-transform:uppercase; padding:4px 10px; z-index:2;
}

/* ---------- GALLERY ---------- */
#gallery { background:var(--warm-white); }
.gallery-intro { max-width:600px; margin-bottom:48px; }
.gallery-intro p { font-size:16px; color:var(--brown-mid); line-height:1.7; margin-top:16px; }

.gallery-grid {
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:8px;
}
.gallery-item {
  position:relative; overflow:hidden;
  aspect-ratio:1; cursor:pointer;
  background:var(--sand);
}
.gallery-item:nth-child(1) { grid-column:span 2; grid-row:span 2; aspect-ratio:auto; min-height:340px; }
.gallery-item:nth-child(7) { grid-column:span 2; }

.gallery-item img {
  width:100%; height:100%; object-fit:cover;
  transition:transform .5s ease, filter .5s ease;
  will-change:transform;
}
.gallery-item:hover img { transform:scale(1.08); filter:brightness(.85); }

.gallery-overlay {
  position:absolute; inset:0;
  background:linear-gradient(to top, rgba(44,26,14,.7) 0%, transparent 60%);
  display:flex; align-items:flex-end; justify-content:space-between;
  padding:18px; opacity:0; transition:opacity .35s;
}
.gallery-item:hover .gallery-overlay { opacity:1; }
.gallery-label { font-family:'Barlow Condensed',sans-serif; font-weight:700; font-size:14px; letter-spacing:1px; color:#fff; text-transform:uppercase; }
.gallery-zoom  { font-size:22px; color:#fff; }

/* Gallery placeholder (when no real images) */
.gallery-placeholder {
  width:100%; height:100%; display:flex; flex-direction:column;
  align-items:center; justify-content:center; gap:10px; padding:20px; text-align:center;
}
.gallery-placeholder .gp-icon { font-size:36px; opacity:.5; }
.gallery-placeholder .gp-label { font-family:'Barlow Condensed',sans-serif; font-weight:700; font-size:13px; letter-spacing:2px; text-transform:uppercase; color:var(--brown-mid); opacity:.6; }

/* Gallery CTA bar */
.gallery-cta {
  display:flex; align-items:center; justify-content:space-between;
  margin-top:40px; padding-top:32px; border-top:2px solid var(--sand);
  flex-wrap:wrap; gap:20px;
}
.gallery-cta p { font-size:15px; color:var(--brown-mid); }
.gallery-cta strong { color:var(--clay); }

/* ---------- LIGHTBOX ---------- */
.lightbox {
  display:none; position:fixed; inset:0; z-index:8000;
  background:rgba(26,15,8,.95); align-items:center; justify-content:center;
  padding:20px;
}
.lightbox.open { display:flex; }
.lightbox-inner {
  position:relative; max-width:900px; width:100%;
  animation:lightboxIn .3s ease;
}
.lightbox-img { width:100%; max-height:85vh; object-fit:contain; }
.lightbox-close {
  position:absolute; top:-44px; right:0;
  background:none; border:none; color:#fff; font-size:32px; cursor:pointer;
  font-family:'Bebas Neue',sans-serif; letter-spacing:2px;
  transition:color .2s;
}
.lightbox-close:hover { color:var(--clay); }
.lightbox-nav {
  position:absolute; top:50%; transform:translateY(-50%);
  background:rgba(194,90,30,.8); border:none; color:#fff;
  font-size:28px; padding:12px 18px; cursor:pointer;
  transition:background .2s;
}
.lightbox-nav:hover { background:var(--clay); }
.lightbox-prev { left:-60px; }
.lightbox-next { right:-60px; }
.lightbox-caption {
  text-align:center; margin-top:14px;
  font-family:'Barlow Condensed',sans-serif; font-size:16px;
  letter-spacing:2px; text-transform:uppercase; color:var(--cream); opacity:.7;
}

/* ---------- WHY CHOOSE US ---------- */
#why { background:var(--brown-dark); }
#why .section-tag { color:var(--clay); }
#why .section-tag::before { background:var(--clay); }
#why .section-title { color:var(--cream); margin-bottom:56px; }

.why-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:2px; }

.why-card {
  background:var(--brown-mid); padding:44px 32px;
  position:relative; overflow:hidden; transition:transform .3s;
  border-bottom:3px solid transparent; transition:border-color .3s, transform .3s;
}
.why-card:hover { transform:translateY(-6px); border-color:var(--clay); }

.why-icon { font-size:40px; margin-bottom:20px; display:block; }
.why-num  { font-family:'Bebas Neue',sans-serif; font-size:54px; color:var(--clay); line-height:1; margin-bottom:6px; }
.why-label{ font-family:'Barlow Condensed',sans-serif; font-weight:700; font-size:18px; letter-spacing:1px; text-transform:uppercase; color:var(--cream); margin-bottom:12px; }
.why-desc { font-size:14px; color:rgba(245,236,215,.55); line-height:1.7; }

/* ---------- TESTIMONIALS ---------- */
#testimonials { background:var(--cream); }
.testimonials-layout { display:grid; grid-template-columns:1fr 1.5fr; gap:80px; align-items:start; }

.testi-left .section-title { margin-bottom:24px; }
.testi-highlight { font-family:'Bebas Neue',sans-serif; font-size:80px; color:var(--clay); line-height:1; display:block; }
.testi-sub { font-size:15px; color:var(--brown-mid); line-height:1.7; margin-top:20px; max-width:320px; }

.testi-cards { display:flex; flex-direction:column; gap:24px; }

.testi-card {
  background:#fff; padding:32px; border-left:4px solid var(--clay);
  position:relative; transition:transform .3s ease, box-shadow .3s ease;
}
.testi-card:hover { transform:translateX(8px); box-shadow:-8px 0 0 var(--clay); }

.testi-quote-mark { font-family:'Bebas Neue',sans-serif; font-size:80px; color:var(--sand); line-height:.5; position:absolute; top:20px; right:24px; }
.testi-stars  { color:var(--clay); font-size:14px; letter-spacing:2px; margin-bottom:14px; }
.testi-text   { font-size:15px; line-height:1.75; color:var(--brown-mid); margin-bottom:20px; font-style:italic; }
.testi-author { display:flex; align-items:center; gap:14px; }
.testi-avatar { width:44px; height:44px; border-radius:50%; background:var(--sand); display:flex; align-items:center; justify-content:center; font-family:'Bebas Neue',sans-serif; font-size:20px; color:var(--clay); flex-shrink:0; }
.testi-name   { font-family:'Barlow Condensed',sans-serif; font-weight:700; font-size:16px; letter-spacing:1px; color:var(--brown-dark); text-transform:uppercase; }
.testi-event  { font-size:12px; color:var(--clay); letter-spacing:1px; font-weight:600; text-transform:uppercase; }

/* ---------- INSTAGRAM SECTION ---------- */
#instagram { background:var(--warm-white); padding:80px; }
.instagram-header { display:flex; justify-content:space-between; align-items:flex-end; margin-bottom:48px; flex-wrap:wrap; gap:24px; }
.instagram-handle { font-family:'Bebas Neue',sans-serif; font-size:28px; letter-spacing:2px; color:var(--clay); display:flex; align-items:center; gap:10px; }

.insta-grid { display:grid; grid-template-columns:repeat(6,1fr); gap:6px; }
.insta-item {
  aspect-ratio:1; position:relative; overflow:hidden;
  background:var(--sand); cursor:pointer;
}
.insta-item img { width:100%; height:100%; object-fit:cover; transition:transform .4s, filter .4s; }
.insta-item:hover img { transform:scale(1.1); filter:brightness(.7); }
.insta-overlay {
  position:absolute; inset:0; display:flex; align-items:center; justify-content:center;
  opacity:0; transition:opacity .3s; background:rgba(194,90,30,.4);
}
.insta-item:hover .insta-overlay { opacity:1; }
.insta-overlay span { font-size:28px; color:#fff; }

.insta-placeholder {
  width:100%; height:100%; display:flex; flex-direction:column;
  align-items:center; justify-content:center; gap:6px;
}
.insta-placeholder span { font-size:28px; opacity:.4; }
.insta-placeholder small { font-family:'Barlow Condensed',sans-serif; font-size:10px; letter-spacing:1px; text-transform:uppercase; color:var(--brown-mid); opacity:.5; }

.insta-cta-bar { margin-top:32px; text-align:center; }

/* ---------- ABOUT ---------- */
#about { background:var(--warm-white); display:grid; grid-template-columns:1fr 1fr; gap:80px; align-items:center; }

.about-img-wrap { position:relative; padding:20px; }
.about-img-main {
  width:100%; aspect-ratio:4/5; background:var(--sand);
  display:flex; align-items:center; justify-content:center;
  position:relative; overflow:hidden;
}
.about-decor {
  position: absolute;
  top: -20px;
  right: -20px;
  width: 100px;
  height: 100px;
  background: var(--clay);
  clip-path: polygon(50% 0%, 100% 50%, 50% 100%, 0% 50%);
  z-index: 1;
  animation: float 4s ease-in-out infinite;
}

.about-decor2 {
  position: absolute;
  bottom: -15px;
  left: -15px;
  width: 60px;
  height: 60px;
  background: var(--moss);
  clip-path: polygon(50% 0%, 100% 50%, 50% 100%, 0% 50%);
  z-index: 1;
  animation: float 4s 1s ease-in-out infinite;
}
.about-badge {
  position:absolute; bottom:20px; right:-20px;
  width:110px; height:110px; background:var(--brown-dark); border-radius:50%;
  display:flex; flex-direction:column; align-items:center; justify-content:center;
  animation:spinBadge 15s linear infinite; z-index:3;
}
.about-badge-num  { font-family:'Bebas Neue',sans-serif; font-size:28px; color:var(--clay); line-height:1; }
.about-badge-text { font-family:'Bebas Neue',sans-serif; font-size:12px; color:var(--cream); letter-spacing:2px; text-align:center; padding:0 10px; line-height:1.3; }

.about-text .section-title { margin-bottom:24px; }
.about-body { font-size:16px; line-height:1.8; color:var(--brown-mid); margin-bottom:16px; }
.about-tags { display:flex; flex-wrap:wrap; gap:10px; margin-top:32px; }
.about-tag {
  font-family:'Barlow Condensed',sans-serif; font-weight:700; font-size:12px;
  letter-spacing:2px; text-transform:uppercase; padding:8px 16px;
  border:2px solid var(--brown-dark); color:var(--brown-dark); transition:all .2s; cursor:default;
}
.about-tag:hover { background:var(--brown-dark); color:var(--cream); }

/* ---------- MAP ---------- */
#map-section { background:var(--cream); padding:0; }
.map-header { padding:60px 80px 40px; }
.map-wrapper { width:100%; height:420px; border-top:3px solid var(--clay); }
.map-wrapper iframe { width:100%; height:100%; border:none; display:block; }

/* ---------- CONTACT ---------- */
#contact { background:var(--clay); }
#contact .section-tag { color:rgba(255,255,255,.7); }
#contact .section-tag::before { background:rgba(255,255,255,.5); }
#contact .section-title { color:#fff; }

.contact-layout { display:grid; grid-template-columns:1fr 1.2fr; gap:80px; align-items:start; }

.contact-info-item { display:flex; gap:20px; margin-bottom:36px; align-items:flex-start; }
.contact-info-icon { width:48px; height:48px; border:2px solid rgba(255,255,255,.4); display:flex; align-items:center; justify-content:center; font-size:20px; flex-shrink:0; }
.contact-info-label { font-family:'Barlow Condensed',sans-serif; font-size:11px; font-weight:700; letter-spacing:3px; text-transform:uppercase; color:rgba(255,255,255,.6); margin-bottom:4px; }
.contact-info-val { font-family:'Bebas Neue',sans-serif; font-size:22px; letter-spacing:1px; color:#fff; }
.contact-info-val a { color:#fff; text-decoration:none; }
.contact-info-val a:hover { text-decoration:underline; }

.contact-wa-btn { margin-top:24px; }

/* Form */
.contact-form { display:flex; flex-direction:column; gap:18px; }
.form-row { display:grid; grid-template-columns:1fr 1fr; gap:18px; }
.form-group { display:flex; flex-direction:column; gap:8px; }
.form-label { font-family:'Barlow Condensed',sans-serif; font-size:11px; font-weight:700; letter-spacing:3px; text-transform:uppercase; color:rgba(255,255,255,.7); }

.form-input,
.form-select,
.form-textarea {
  background:rgba(255,255,255,.1); border:2px solid rgba(255,255,255,.2);
  padding:14px 18px; font-family:'Barlow',sans-serif; 
  font-size:16px !important;
  color:#fff; outline:none; transition:border-color .2s, background .2s; width:100%;
  touch-action:manipulation;
  -webkit-appearance:none;
  -moz-appearance:none;
  appearance:none;
}
.form-input::placeholder, .form-textarea::placeholder { color:rgba(255,255,255,.35); }
.form-select { 
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' fill='white'%3E%3Cpath d='M6 8L0 0h12z'/%3E%3C/svg%3E"); 
  background-repeat:no-repeat; 
  background-position:right 16px center; 
  padding-right:40px;
}
.form-select option { background:var(--rust); color:#fff; }
.form-input:focus, .form-select:focus, .form-textarea:focus { 
  border-color:#fff; 
  background:rgba(255,255,255,.15);
  outline:2px solid var(--clay);
  outline-offset:0;
}
.form-input.error, .form-select.error, .form-textarea.error { 
  border-color:#ff6b6b; 
  background:rgba(255,100,107,.15);
}
.form-textarea { 
  resize:vertical; 
  min-height:120px;
  font-family:'Barlow',sans-serif;
}

.btn-submit {
  background:var(--brown-dark); color:var(--cream);
  font-family:'Bebas Neue',sans-serif; font-size:22px; letter-spacing:4px;
  border:none; padding:18px 48px; cursor:pointer; transition:background .2s, transform .15s;
  align-self:flex-start; min-height:60px;
  clip-path:polygon(0 0, calc(100% - 14px) 0, 100% 14px, 100% 100%, 14px 100%, 0 calc(100% - 14px));
}
.btn-submit:hover { background:var(--ink); transform:translateY(-2px); }

.form-success {
  display:none; background:rgba(255,255,255,.15); border:2px solid rgba(255,255,255,.4);
  padding:32px; text-align:center;
}
.form-success.show { display:block; }
.form-success h3 { font-family:'Bebas Neue',sans-serif; font-size:36px; color:#fff; letter-spacing:2px; margin-bottom:10px; }
.form-success p { color:rgba(255,255,255,.8); font-size:15px; line-height:1.6; }

/* ---------- FLOATING WHATSAPP ---------- */
.wa-float {
  position:fixed; bottom:30px; right:30px; z-index:1000;
  width:60px; height:60px; background:var(--wa-green); border-radius:50%;
  display:flex; align-items:center; justify-content:center;
  text-decoration:none; box-shadow:0 4px 24px rgba(37,211,102,.5);
  animation:waFloat 3s ease-in-out infinite;
  transition:transform .2s, box-shadow .2s;
  -webkit-tap-highlight-color:transparent;
  min-height:60px;
  min-width:60px;
  touch-action:manipulation;
}
.wa-float:hover { transform:scale(1.1) translateY(-4px); box-shadow:0 8px 32px rgba(37,211,102,.7); animation:none; }
.wa-float:active { transform:scale(.95); }
.wa-float svg { width:32px; height:32px; fill:#fff; }
.wa-float-label {
  position:absolute; right:72px; top:50%; transform:translateY(-50%);
  background:var(--brown-dark); color:var(--cream);
  font-family:'Barlow Condensed',sans-serif; font-weight:700;
  font-size:12px; letter-spacing:2px; text-transform:uppercase;
  padding:8px 14px; white-space:nowrap; pointer-events:none;
  opacity:0; transition:opacity .2s;
}
.wa-float:hover .wa-float-label { opacity:1; }

/* ---------- FOOTER ---------- */
footer { background:var(--ink); padding:60px 80px 36px; }
.footer-top {
  display:grid; grid-template-columns:1.5fr 1fr 1fr 1fr;
  gap:48px; padding-bottom:48px;
  border-bottom:1px solid rgba(255,255,255,.1); margin-bottom:36px;
}
.footer-brand-name { font-family:'Bebas Neue',sans-serif; font-size:40px; letter-spacing:3px; color:var(--cream); line-height:1; margin-bottom:16px; }
.footer-brand-name span { color:var(--clay); }
.footer-brand-desc { font-size:14px; color:rgba(255,255,255,.4); line-height:1.7; max-width:260px; }
.footer-col-title { font-family:'Barlow Condensed',sans-serif; font-size:11px; font-weight:700; letter-spacing:4px; text-transform:uppercase; color:var(--clay); margin-bottom:20px; }
.footer-links { list-style:none; display:flex; flex-direction:column; gap:12px; }
.footer-links a { font-size:14px; color:rgba(255,255,255,.5); text-decoration:none; transition:color .2s; font-family:'Barlow Condensed',sans-serif; font-weight:600; letter-spacing:1px; }
.footer-links a:hover { color:var(--cream); }

.footer-contact-item { display:flex; flex-direction:column; gap:2px; margin-bottom:12px; }
.footer-contact-label { font-size:10px; color:var(--clay); letter-spacing:2px; text-transform:uppercase; font-weight:700; }
.footer-contact-val   { font-size:14px; color:rgba(255,255,255,.6); }
.footer-contact-val a { color:rgba(255,255,255,.6); text-decoration:none; }
.footer-contact-val a:hover { color:#fff; }

.footer-social { display:flex; gap:10px; margin-top:20px; }
.social-link {
  width:38px; height:38px; border:1px solid rgba(255,255,255,.15);
  display:flex; align-items:center; justify-content:center;
  color:rgba(255,255,255,.45); font-size:17px; text-decoration:none;
  transition:all .2s;
}
.social-link:hover { border-color:var(--clay); color:var(--clay); }

.footer-bottom { display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:16px; }
.footer-copy { font-size:12px; color:rgba(255,255,255,.3); letter-spacing:1px; font-family:'Barlow Condensed',sans-serif; font-weight:600; text-transform:uppercase; }
.footer-bottom-links { display:flex; gap:20px; }
.footer-bottom-links a { font-size:12px; color:rgba(255,255,255,.3); text-decoration:none; font-family:'Barlow Condensed',sans-serif; font-weight:600; letter-spacing:1px; text-transform:uppercase; transition:color .2s; }
.footer-bottom-links a:hover { color:rgba(255,255,255,.7); }

/* ============================================================
   RESPONSIVE — TABLET & DESKTOP FIRST
   ============================================================ */

/* ═══ DESKTOP: 1200px+ ═══ */
@media (max-width:1400px) {
  .hero-img-wrap { width:320px; }
  .mandala-bg { width:500px; height:500px; right:-60px; }
}

/* ═══ LARGE TABLET: 1100px - 1199px ═══ */
@media (max-width:1100px) {
  nav { padding:14px 36px; }
  section { padding:80px 48px; }
  
  .hero-left { padding:60px 48px 60px 60px; }
  .hero-title { font-size:clamp(52px,7vw,100px); }
  .hero-sub { max-width:320px; font-size:15px; }
  .hero-img-wrap { width:300px; }
  
  .section-title { font-size:clamp(48px,5.5vw,80px); }
  
  .services-grid { grid-template-columns:repeat(2,1fr); }
  .service-card { padding:32px 24px; }
  .service-icon { font-size:28px; }
  .service-name { font-size:28px; }
  .service-price { font-size:32px; }
  
  .pricing-grid { grid-template-columns:repeat(4,1fr); }
  .pricing-card { padding:24px 20px; }
  .pricing-card h3 { font-size:15px; }
  .pricing-card .price { font-size:38px; }
  
  .gallery-grid { grid-template-columns:repeat(3,1fr); gap:6px; }
  .gallery-item:nth-child(1) { grid-column:span 2; min-height:280px; }
  .gallery-item:nth-child(7) { grid-column:span 1; }
  
  .why-grid { grid-template-columns:repeat(2,1fr); }
  .why-card { padding:36px 28px; }
  .why-num { font-size:48px; }
  
  .testimonials-layout { grid-template-columns:1fr; gap:48px; }
  .testi-highlight { font-size:72px; }
  .testi-cards { gap:20px; }
  
  .insta-grid { grid-template-columns:repeat(4,1fr); }
  
  #about { grid-template-columns:1fr; gap:48px; }
  .about-img-wrap { max-width:350px; margin:0 auto; }
  
  .contact-layout { grid-template-columns:1fr; gap:48px; }
  .form-row { grid-template-columns:1fr 1fr; }
  
  .footer-top { grid-template-columns:1fr 1fr; gap:36px; }
  .footer-brand-name { font-size:36px; }
}

/* ═══ TABLET: 768px - 1099px ═══ */
@media (max-width:1024px) {
  nav { padding:12px 28px; }
  nav.scrolled { padding:8px 28px; }
  
  .nav-logo { font-size:22px; letter-spacing:2px; }
  .nav-hamburger { display:flex; }
  .nav-links { display:none !important; }
  
  section { padding:64px 32px; }
  .section-title { font-size:clamp(40px,5vw,72px); margin-bottom:36px; }
  .section-tag { font-size:10px; gap:10px; }
  
  /* HERO */
  #hero { grid-template-columns:1fr; min-height:70vh; padding-top:60px; }
  .hero-bg-pattern { display:none; }
  .mandala-bg { width:400px; height:400px; right:-40px; top:40%; }
  
  .hero-left { padding:40px 32px 40px 32px; justify-content:center; }
  .hero-title { font-size:clamp(40px,6vw,72px); line-height:0.95; }
  .hero-tag { font-size:10px; padding:5px 12px; margin-bottom:20px; }
  .hero-sub { font-size:15px; max-width:300px; margin-top:16px; }
  .hero-cta { gap:12px; margin-top:28px; flex-wrap:wrap; }
  .hero-stats { gap:28px; margin-top:32px; }
  .stat-num { font-size:32px; }
  .stat-label { font-size:10px; }
  
  .hero-right { padding:40px 32px; }
  .hero-img-wrap { width:280px; }
  .scroll-hint { display:none; }
  
  /* MARQUEE */
  .marquee-item { font-size:18px; padding:0 24px; }
  
  /* BUTTONS */
  .btn-primary, .btn-outline, .btn-wa { font-size:13px; padding:12px 24px; min-height:48px; }
  
  /* SERVICES */
  .services-grid { grid-template-columns:repeat(2,1fr); gap:3px; }
  .service-card { padding:28px 20px; }
  .service-num { font-size:56px; }
  .service-icon { font-size:24px; margin-bottom:16px; }
  .service-name { font-size:26px; margin-bottom:8px; }
  .service-desc { font-size:13px; margin-bottom:16px; }
  .service-price { font-size:28px; }
  .service-price small { font-size:12px; }
  
  /* BASIC PRICING */
  .pricing-grid { grid-template-columns:repeat(3,1fr); gap:12px; }
  .pricing-card { padding:22px 18px; }
  .pricing-card h3 { font-size:14px; margin-bottom:12px; }
  .pricing-card .price { font-size:34px; }
  
  /* GALLERY */
  .gallery-grid { grid-template-columns:repeat(2,1fr); gap:4px; }
  .gallery-item:nth-child(1) { grid-column:span 2; min-height:240px; }
  .gallery-item:nth-child(7) { grid-column:span 2; }
  .gallery-overlay { padding:14px; }
  .gallery-label { font-size:12px; }
  .gallery-zoom { font-size:18px; }
  .gallery-cta { flex-direction:column; align-items:flex-start; gap:16px; margin-top:32px; }
  .gallery-cta p { font-size:14px; }
  
  /* WHY */
  .why-grid { grid-template-columns:repeat(2,1fr); gap:2px; }
  .why-card { padding:32px 24px; }
  .why-icon { font-size:32px; }
  .why-num { font-size:44px; }
  .why-label { font-size:16px; }
  .why-desc { font-size:13px; }
  
  /* TESTIMONIALS */
  .testimonials-layout { grid-template-columns:1fr; gap:36px; }
  .testi-left .section-title { margin-bottom:20px; }
  .testi-highlight { font-size:60px; }
  .testi-sub { font-size:14px; max-width:280px; }
  .testi-cards { gap:18px; }
  .testi-card { padding:24px; border-left-width:3px; }
  .testi-quote-mark { font-size:64px; }
  .testi-text { font-size:14px; margin-bottom:16px; }
  .testi-avatar { width:40px; height:40px; font-size:16px; }
  .testi-name { font-size:14px; }
  
  /* INSTAGRAM */
  #instagram { padding:64px 32px; }
  .instagram-header { flex-direction:column; align-items:flex-start; gap:20px; margin-bottom:36px; }
  .instagram-handle { font-size:24px; }
  .insta-grid { grid-template-columns:repeat(3,1fr); gap:4px; }
  
  /* ABOUT */
  #about { grid-template-columns:1fr; padding:64px 32px; gap:40px; }
  .about-img-wrap { max-width:300px; margin:0 auto; }
  .about-text .section-title { margin-bottom:20px; }
  .about-body { font-size:15px; margin-bottom:12px; }
  .about-tags { gap:8px; margin-top:24px; }
  .about-tag { font-size:11px; padding:7px 14px; }
  
  /* MAP */
  .map-header { padding:48px 32px 32px; }
  .map-wrapper { height:360px; }
  
  /* CONTACT */
  #contact { padding:64px 32px; }
  .contact-layout { grid-template-columns:1fr; gap:40px; }
  .contact-info-item { gap:16px; margin-bottom:28px; }
  .contact-info-icon { width:44px; height:44px; font-size:18px; }
  .contact-info-label { font-size:10px; }
  .contact-info-val { font-size:18px; }
  
  .contact-form { gap:16px; }
  .form-row { grid-template-columns:1fr; }
  .form-group { gap:6px; }
  .form-label { font-size:10px; }
  .form-input, .form-textarea, .form-select { padding:12px 16px; font-size:14px; }
  .form-textarea { min-height:100px; }
  .btn-submit { font-size:18px; padding:14px 32px; min-height:52px; width:100%; text-align:center; }
  
  /* LIGHTBOX */
  .lightbox { padding:12px; }
  .lightbox-close { font-size:24px; top:-32px; right:0; }
  .lightbox-nav { font-size:24px; padding:10px 14px; }
  .lightbox-prev { left:0; }
  .lightbox-next { right:0; }
  .lightbox-caption { font-size:13px; margin-top:12px; }
  
  /* FOOTER */
  footer { padding:48px 32px 24px; }
  .footer-top { grid-template-columns:1fr 1fr; gap:32px; margin-bottom:32px; }
  .footer-brand-name { font-size:32px; }
  .footer-brand-desc { font-size:13px; max-width:240px; }
  .footer-col-title { font-size:10px; }
  .footer-links a { font-size:13px; }
  .footer-contact-item { margin-bottom:10px; }
  .footer-contact-label { font-size:9px; }
  .footer-contact-val { font-size:13px; }
  .social-link { width:36px; height:36px; font-size:16px; }
  .footer-copy { font-size:11px; }
  
  /* WA FLOAT */
  .wa-float { bottom:24px; right:24px; width:56px; height:56px; }
  .wa-float svg { width:28px; height:28px; }
  .wa-float-label { font-size:11px; padding:6px 12px; right:64px; }
  
  /* ANIMATIONS & DECORATIONS */
  .mandala-bg { animation-duration:50s; }
  .marquee-inner { animation-duration:18s; }
  .about-decor { width:80px; height:80px; }
  .about-decor2 { width:50px; height:50px; }
}

/* ═══ MOBILE LARGE: 600px - 767px ═══ */
@media (max-width:768px) {
  body { font-size:14px; }
  
  nav { padding:10px 20px; gap:8px; }
  nav.scrolled { padding:6px 20px; }
  
  .nav-logo { font-size:18px; letter-spacing:1px; gap:6px; }
  .nav-logo img { width:32px; height:32px; }
  
  section { padding:48px 20px; }
  .section-tag { font-size:9px; letter-spacing:3px; padding:4px 10px; margin-bottom:10px; gap:8px; }
  .section-tag::before { width:24px; height:2px; }
  .section-title { font-size:clamp(32px,4vw,56px); margin-bottom:28px; line-height:1; }
  
  /* HERO */
  #hero { min-height:60vh; padding-top:50px; }
  .hero-left { padding:32px 20px; gap:16px; }
  .hero-tag { font-size:9px; padding:4px 10px; margin-bottom:16px; letter-spacing:3px; }
  .hero-title { font-size:clamp(32px,5vw,56px); letter-spacing:1px; }
  .hero-title span { display:block; }
  .hero-sub { font-size:14px; line-height:1.6; max-width:100%; margin-top:12px; }
  .hero-cta { gap:10px; margin-top:20px; }
  .hero-stats { gap:20px; margin-top:24px; flex-wrap:wrap; }
  .stat-num { font-size:28px; }
  .stat-label { font-size:9px; }
  
  .hero-right { padding:32px 20px; justify-content:center; }
  .hero-img-wrap { width:240px; }
  .hero-img-wrap::before { border-width:2px; inset:-8px -8px 8px 8px; }
  .hero-img-wrap::after { font-size:14px; padding:8px 14px; bottom:-16px; right:-16px; }
  
  .scroll-hint { display:none; }
  .mandala-bg { display:none; }
  
  /* MARQUEE */
  .marquee-strip { padding:10px 0; }
  .marquee-item { font-size:14px; padding:0 16px; letter-spacing:2px; }
  
  /* BUTTONS */
  .btn-primary, .btn-outline, .btn-wa { font-size:12px; padding:11px 20px; min-height:46px; letter-spacing:1px; }
  
  /* SERVICES */
  .services-grid { grid-template-columns:1fr; gap:2px; }
  .service-card { padding:24px 18px; }
  .service-num { font-size:48px; top:12px; right:16px; }
  .service-icon { font-size:22px; margin-bottom:12px; }
  .service-name { font-size:22px; margin-bottom:6px; }
  .service-desc { font-size:12px; line-height:1.6; margin-bottom:12px; }
  .service-price { font-size:24px; }
  .service-price small { font-size:11px; }
  .service-badge { font-size:9px; padding:3px 8px; }
  
  /* BASIC PRICING */
  .pricing-grid { grid-template-columns:repeat(2,1fr); gap:12px; }
  .pricing-card { padding:20px 16px; }
  .pricing-card h3 { font-size:14px; margin-bottom:12px; }
  .pricing-card .price { font-size:32px; }
  .pricing-note { font-size:12px; }
  
  /* GALLERY */
  .gallery-intro { margin-bottom:32px; }
  .gallery-intro p { font-size:14px; margin-top:12px; }
  .gallery-grid { grid-template-columns:repeat(2,1fr); gap:3px; }
  .gallery-item:nth-child(1) { grid-column:span 2; min-height:200px; }
  .gallery-item:nth-child(7) { grid-column:span 2; }
  .gallery-overlay { padding:10px; }
  .gallery-label { font-size:11px; }
  .gallery-zoom { font-size:16px; }
  .gallery-cta { flex-direction:column; align-items:flex-start; gap:12px; margin-top:28px; border-top:2px solid var(--sand); padding-top:20px; }
  .gallery-cta p { font-size:13px; }
  
  /* WHY */
  .why-grid { grid-template-columns:1fr; gap:2px; }
  .why-card { padding:24px 18px; }
  .why-icon { font-size:28px; margin-bottom:14px; }
  .why-num { font-size:36px; margin-bottom:4px; }
  .why-label { font-size:14px; margin-bottom:8px; }
  .why-desc { font-size:12px; line-height:1.6; }
  
  /* TESTIMONIALS */
  .testi-highlight { font-size:48px; }
  .testi-sub { font-size:13px; max-width:100%; }
  .testi-card { padding:20px; margin-bottom:12px; }
  .testi-quote-mark { font-size:48px; }
  .testi-text { font-size:13px; line-height:1.6; margin-bottom:12px; }
  .testi-avatar { width:36px; height:36px; font-size:14px; }
  .testi-name { font-size:12px; }
  .testi-event { font-size:11px; }
  
  /* INSTAGRAM */
  #instagram { padding:48px 20px; }
  .instagram-header { gap:12px; margin-bottom:28px; }
  .instagram-handle { font-size:20px; }
  .insta-grid { grid-template-columns:repeat(2,1fr); gap:3px; }
  
  /* ABOUT */
  #about { gap:32px; padding:48px 20px; }
  .about-img-wrap { max-width:280px; }
  .about-body { font-size:14px; line-height:1.7; margin-bottom:10px; }
  .about-tags { gap:6px; margin-top:16px; }
  .about-tag { font-size:10px; padding:6px 12px; }
  
  /* MAP */
  .map-header { padding:40px 20px 24px; }
  .map-wrapper { height:300px; }
  
  /* CONTACT */
  #contact { padding:48px 20px; }
  .contact-layout { gap:32px; }
  .contact-info-item { gap:12px; margin-bottom:20px; }
  .contact-info-icon { width:40px; height:40px; font-size:16px; }
  .contact-info-label { font-size:9px; }
  .contact-info-val { font-size:16px; }
  
  .contact-form { gap:14px; }
  .form-label { font-size:9px; }
  .form-input, .form-textarea, .form-select { padding:10px 14px; font-size:13px; border-width:1px; }
  .form-textarea { min-height:90px; }
  .btn-submit { font-size:16px; padding:12px 24px; }
  
  /* LIGHTBOX */
  .lightbox-close { font-size:20px; top:-28px; }
  .lightbox-nav { font-size:20px; padding:8px 12px; }
  .lightbox-img { max-height:80vh; }
  .lightbox-caption { font-size:12px; }
  
  /* FOOTER */
  footer { padding:40px 20px 20px; }
  .footer-top { grid-template-columns:1fr; gap:20px; margin-bottom:20px; }
  .footer-brand-name { font-size:24px; letter-spacing:2px; margin-bottom:12px; }
  .footer-brand-desc { font-size:12px; max-width:100%; }
  .footer-col-title { font-size:9px; letter-spacing:3px; margin-bottom:12px; }
  .footer-links a { font-size:12px; }
  .footer-contact-item { margin-bottom:8px; }
  .footer-contact-label { font-size:8px; }
  .footer-contact-val { font-size:12px; }
  .social-link { width:32px; height:32px; font-size:14px; }
  .footer-bottom { gap:12px; }
  .footer-copy { font-size:10px; }
  .footer-bottom-links { gap:12px; }
  .footer-bottom-links a { font-size:10px; }
  
  /* WA FLOAT */
  .wa-float { bottom:16px; right:16px; width:50px; height:50px; box-shadow:0 2px 16px rgba(37,211,102,.4); }
  .wa-float svg { width:24px; height:24px; }
  .wa-float-label { font-size:10px; padding:4px 8px; right:56px; }
  
  /* ANIMATIONS */
  .mandala-bg { display:none; }
  .about-decor, .about-decor2 { display:none; }
  body::before { opacity:0.03; }
}

/* ═══ MOBILE SMALL/MEDIUM: 400px - 599px ═══ */
@media (max-width:600px) {
  html { font-size:13px; }
  
  nav { padding:8px 16px; border-bottom-width:1px; }
  .nav-logo { font-size:16px; gap:4px; }
  .nav-logo img { width:28px; height:28px; }
  
  section { padding:40px 16px; }
  .section-tag { font-size:8px; letter-spacing:2px; padding:3px 8px; margin-bottom:8px; }
  .section-tag::before { width:16px; height:1px; }
  .section-title { font-size:clamp(26px,5vw,44px); margin-bottom:24px; }
  
  /* HERO */
  #hero { min-height:50vh; padding-top:45px; }
  .hero-left { padding:24px 16px; gap:12px; }
  .hero-tag { font-size:8px; padding:3px 8px; margin-bottom:12px; }
  .hero-title { font-size:clamp(26px,6vw,44px); }
  .hero-sub { font-size:13px; margin-top:10px; }
  .hero-cta { gap:8px; margin-top:16px; }
  .hero-stats { gap:16px; margin-top:20px; }
  .stat-num { font-size:24px; }
  .stat-label { font-size:8px; }
  
  .hero-right { padding:24px 16px; }
  .hero-img-wrap { width:200px; }
  .hero-img-wrap::before { inset:-6px -6px 6px 6px; }
  .hero-img-wrap::after { font-size:12px; padding:6px 10px; bottom:-12px; right:-12px; letter-spacing:1px; }
  
  /* MARQUEE */
  .marquee-item { font-size:12px; padding:0 12px; }
  
  /* BUTTONS */
  .btn-primary, .btn-outline, .btn-wa { font-size:11px; padding:10px 16px; min-height:44px; clip-path:polygon(0 0, calc(100% - 8px) 0, 100% 8px, 100% 100%, 8px 100%, 0 calc(100% - 8px)); }
  
  /* SERVICES */
  .services-grid { grid-template-columns:1fr; }
  .service-card { padding:20px 14px; }
  .service-num { font-size:40px; }
  .service-icon { font-size:20px; }
  .service-name { font-size:18px; }
  .service-desc { font-size:11px; }
  .service-price { font-size:20px; }
  
  /* GALLERY */
  .gallery-intro p { font-size:13px; }
  .gallery-grid { gap:2px; }
  .gallery-item:nth-child(1) { min-height:160px; }
  .gallery-label { font-size:10px; }
  
  /* WHY */
  .why-grid { grid-template-columns:1fr; }
  .why-card { padding:20px 14px; }
  .why-icon { font-size:24px; }
  .why-num { font-size:30px; }
  .why-label { font-size:12px; }
  .why-desc { font-size:11px; }
  
  /* TESTIMONIALS */
  .testi-highlight { font-size:36px; }
  .testi-card { padding:16px; margin-bottom:10px; }
  .testi-text { font-size:12px; }
  .testi-avatar { width:32px; height:32px; font-size:12px; }
  
  /* INSTAGRAM */
  #instagram { padding:40px 16px; }
  .instagram-handle { font-size:18px; }
  .insta-grid { grid-template-columns:repeat(2,1fr); }
  
  /* ABOUT */
  #about { gap:24px; padding:40px 16px; }
  .about-body { font-size:13px; }
  .about-tag { font-size:9px; padding:5px 10px; }
  
  /* MAP */
  .map-header { padding:32px 16px 20px; }
  .map-wrapper { height:260px; }
  
  /* CONTACT */
  #contact { padding:40px 16px; }
  .contact-info-icon { width:36px; height:36px; font-size:14px; }
  .contact-info-val { font-size:14px; }
  .form-input, .form-textarea, .form-select { padding:8px 12px; font-size:12px; }
  .form-textarea { min-height:80px; }
  .btn-submit { font-size:14px; padding:10px 20px; }
  
  /* FOOTER */
  footer { padding:32px 16px 16px; }
  .footer-top { gap:16px; }
  .footer-brand-name { font-size:20px; }
  .footer-brand-desc { font-size:11px; }
  .footer-col-title { font-size:8px; }
  .footer-links a { font-size:11px; }
  .footer-contact-val { font-size:11px; }
  .footer-copy { font-size:9px; }
  
  /* WA FLOAT */
  .wa-float { width:48px; height:48px; }
  .wa-float svg { width:22px; height:22px; }
}

/* ═══ MOBILE EXTRA SMALL: < 400px ═══ */
@media (max-width:400px) {
  html { font-size:12px; }
  
  nav { padding:6px 12px; }
  .nav-logo { font-size:14px; }
  .nav-logo img { width:24px; height:24px; }
  
  section { padding:32px 12px; }
  .section-tag { font-size:7px; letter-spacing:1px; padding:2px 6px; }
  .section-tag::before { width:12px; }
  .section-title { font-size:clamp(22px,5vw,36px); margin-bottom:20px; }
  
  /* HERO */
  #hero { min-height:55vh; padding-top:40px; }
  .hero-left { padding:20px 12px; }
  .hero-title { font-size:clamp(22px,6vw,36px); }
  .hero-sub { font-size:12px; }
  .hero-cta { gap:6px; }
  .hero-stats { gap:12px; }
  .stat-num { font-size:20px; }
  
  .hero-right { padding:20px 12px; }
  .hero-img-wrap { width:160px; }
  .hero-img-wrap::before { inset:-4px -4px 4px 4px; border-width:2px; }
  .hero-img-wrap::after { font-size:10px; padding:4px 8px; bottom:-10px; right:-10px; }
  
  /* BUTTONS */
  .btn-primary, .btn-outline, .btn-wa { font-size:10px; padding:8px 12px; min-height:40px; }
  
  /* SERVICES */
  .service-card { padding:16px 12px; }
  .service-num { font-size:36px; }
  .service-icon { font-size:18px; }
  .service-name { font-size:16px; }
  .service-price { font-size:18px; }
  
  /* WHY */
  .why-card { padding:16px 12px; }
  .why-icon { font-size:20px; }
  .why-num { font-size:26px; }
  .why-label { font-size:11px; }
  
  /* TESTIMONIALS */
  .testi-highlight { font-size:30px; }
  .testi-card { padding:14px; }
  
  /* CONTACT */
  .contact-info-val { font-size:13px; }
  .form-input, .form-textarea { font-size:11px; padding:6px 10px; }
  .form-textarea { min-height:70px; }
  .btn-submit { font-size:12px; padding:8px 16px; }
  
  /* FOOTER */
  footer { padding:24px 12px 12px; }
  .footer-brand-name { font-size:18px; }
  .footer-brand-desc { font-size:10px; }
  
  /* WA FLOAT */
  .wa-float { width:44px; height:44px; bottom:12px; right:12px; }
  .wa-float svg { width:20px; height:20px; }
  .wa-float-label { display:none; }
}

/* ═══ PREVENT LAYOUT SHIFT ═══ */
@media (max-width:600px) {
  input, textarea, select, button { font-size:16px !important; }
}

/* ═══ REDUCE ANIMATIONS FOR ACCESSIBILITY ═══ */
@media (prefers-reduced-motion:reduce) {
  * { animation-duration:0.01ms !important; animation-iteration-count:1 !important; transition-duration:0.01ms !important; }
  .mandala-bg, .about-badge, .marquee-inner, .waFloat { animation:none !important; }
}

/* ═══ DARK MODE SUPPORT ═══ */
@media (prefers-color-scheme:dark) {
  :root {
    --warm-white:#1a1a1a;
    --cream: #2a2a2a;
  }
}

/* ============================================================
   MULTI-PAGE STYLES
   ============================================================ */

/* ---------- SR-ONLY (screen reader only) ---------- */
.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;
}

/* ---------- PAGE HEADER ---------- */
.page-header {
  background:var(--brown-dark);
  padding:140px 80px 80px;
  position:relative;
  overflow:hidden;
}
.page-header::before {
  content:'';
  position:absolute; inset:0;
  background:
    radial-gradient(circle at 20% 50%, rgba(194,90,30,.12) 0%, transparent 50%),
    radial-gradient(circle at 80% 20%, rgba(92,107,58,.08) 0%, transparent 40%);
  pointer-events:none;
}
.page-header::after {
  content:''; position:absolute; bottom:0; left:0; right:0;
  height:4px; background:linear-gradient(90deg, var(--clay), var(--moss), var(--clay));
}
.page-header-inner { position:relative; z-index:1; max-width:800px; }
.page-header-title {
  font-family:'Bebas Neue',sans-serif;
  font-size:clamp(52px,7vw,100px); line-height:.9; letter-spacing:2px;
  color:var(--cream); margin-bottom:24px;
}
.page-header-title .accent { color:var(--clay); }
.page-header-sub {
  font-size:17px; line-height:1.7; color:rgba(245,236,215,.65); max-width:560px;
}

/* ---------- CTA BANNER ---------- */
.cta-banner {
  background:var(--brown-dark);
  padding:80px;
}
.cta-banner-inner {
  background:var(--clay);
  padding:64px 80px;
  text-align:center;
  position:relative;
  overflow:hidden;
  clip-path:polygon(0 0, calc(100% - 24px) 0, 100% 24px, 100% 100%, 24px 100%, 0 calc(100% - 24px));
}
.cta-banner-inner::before {
  content:'';
  position:absolute; inset:0;
  background:
    radial-gradient(circle at 30% 30%, rgba(255,255,255,.08) 0%, transparent 50%),
    radial-gradient(circle at 70% 70%, rgba(0,0,0,.1) 0%, transparent 50%);
  pointer-events:none;
}
.cta-banner-title {
  font-family:'Bebas Neue',sans-serif;
  font-size:clamp(40px,5vw,72px); line-height:.92;
  color:#fff; letter-spacing:2px; margin-bottom:16px;
  position:relative; z-index:1;
}
.cta-banner-sub {
  font-size:16px; color:rgba(255,255,255,.8); margin-bottom:32px;
  max-width:480px; margin-left:auto; margin-right:auto;
  position:relative; z-index:1;
}
.cta-banner-btns {
  display:flex; gap:16px; justify-content:center; flex-wrap:wrap;
  position:relative; z-index:1;
}
.cta-banner .btn-primary { background:var(--brown-dark); }
.cta-banner .btn-primary:hover { background:var(--ink); }

/* ---------- STATS BAR ---------- */
.stats-bar {
  background:var(--clay);
  padding:48px 80px;
}
.stats-bar-inner {
  display:grid; grid-template-columns:repeat(4,1fr); gap:32px;
  text-align:center;
}
.stats-bar-item { position:relative; }
.stats-bar-item:not(:last-child)::after {
  content:''; position:absolute; right:0; top:10%; height:80%;
  width:1px; background:rgba(255,255,255,.2);
}
.stats-bar-num {
  font-family:'Bebas Neue',sans-serif; font-size:52px;
  color:#fff; line-height:1;
}
.stats-bar-label {
  font-family:'Barlow Condensed',sans-serif; font-weight:700;
  font-size:12px; letter-spacing:3px; text-transform:uppercase;
  color:rgba(255,255,255,.7); margin-top:8px;
}

/* ---------- REVIEWS GRID ---------- */
.reviews-grid {
  display:grid; grid-template-columns:repeat(2,1fr); gap:24px;
}

/* ---------- PROCESS STEPS ---------- */
.process-section { background:var(--cream); }
.process-section .section-tag { color:var(--clay); }
.process-section .section-title { color:var(--brown-dark); }

.process-steps {
  display:grid; grid-template-columns:repeat(4,1fr); gap:2px;
}
.process-step {
  background:var(--brown-dark); padding:40px 28px;
  position:relative; transition:transform .3s;
}
.process-step:hover { transform:translateY(-4px); }
.process-step-num {
  font-family:'Bebas Neue',sans-serif; font-size:72px;
  color:rgba(194,90,30,.2); line-height:1; margin-bottom:16px;
}
.process-step-title {
  font-family:'Barlow Condensed',sans-serif; font-weight:700;
  font-size:20px; letter-spacing:1px; text-transform:uppercase;
  color:var(--cream); margin-bottom:12px;
}
.process-step-desc {
  font-size:14px; color:rgba(245,236,215,.55); line-height:1.7;
}

/* ---------- TIMELINE ---------- */
.timeline-section { background:var(--brown-dark); }
.timeline-section .section-tag { color:var(--clay); }
.timeline-section .section-tag::before { background:var(--clay); }
.timeline-section .section-title { color:var(--cream); }

.timeline {
  position:relative; padding-left:48px; max-width:700px;
}
.timeline::before {
  content:''; position:absolute; left:16px; top:0; bottom:0;
  width:2px; background:var(--clay);
}
.timeline-item {
  position:relative; margin-bottom:48px;
}
.timeline-item:last-child { margin-bottom:0; }
.timeline-dot {
  position:absolute; left:-40px; top:6px;
  width:16px; height:16px; background:var(--clay);
  border-radius:50%; border:3px solid var(--brown-dark);
  z-index:1;
}
.timeline-content { padding-left:8px; }
.timeline-year {
  font-family:'Bebas Neue',sans-serif; font-size:28px;
  color:var(--clay); letter-spacing:2px; margin-bottom:8px;
}
.timeline-heading {
  font-family:'Barlow Condensed',sans-serif; font-weight:700;
  font-size:20px; letter-spacing:1px; text-transform:uppercase;
  color:var(--cream); margin-bottom:10px;
}
.timeline-desc {
  font-size:15px; color:rgba(245,236,215,.55); line-height:1.7;
}

/* ---------- FAQ ACCORDION ---------- */
.faq-section { background:var(--warm-white); padding:80px; max-width:900px; margin:0 auto; }

.faq-category { margin-bottom:48px; }
.faq-category-title {
  font-family:'Bebas Neue',sans-serif; font-size:32px;
  color:var(--brown-dark); letter-spacing:2px;
  margin-bottom:20px; padding-bottom:12px;
  border-bottom:2px solid var(--sand);
}

.faq-item {
  border-bottom:1px solid var(--sand);
  overflow:hidden;
}
.faq-question {
  width:100%; display:flex; justify-content:space-between; align-items:center;
  padding:20px 0; background:none; border:none; cursor:pointer;
  font-family:'Barlow Condensed',sans-serif; font-weight:700;
  font-size:18px; letter-spacing:.5px; color:var(--brown-dark);
  text-align:left; transition:color .2s;
  min-height:56px;
}
.faq-question:hover { color:var(--clay); }
.faq-icon {
  font-size:28px; color:var(--clay); transition:transform .3s;
  flex-shrink:0; width:32px; text-align:center;
  font-weight:300;
}
.faq-item.open .faq-icon { transform:rotate(45deg); }
.faq-answer {
  max-height:0; overflow:hidden; transition:max-height .4s ease, padding .4s ease;
  padding:0 0;
}
.faq-item.open .faq-answer {
  max-height:600px; padding:0 0 24px;
}
.faq-answer p {
  font-size:15px; color:var(--brown-mid); line-height:1.8; margin-bottom:12px;
}
.faq-answer p:last-child { margin-bottom:0; }
.faq-answer ul {
  margin:12px 0 12px 20px; padding:0;
}
.faq-answer li {
  font-size:14px; color:var(--brown-mid); line-height:1.8; margin-bottom:4px;
}
.faq-answer a { color:var(--clay); text-decoration:underline; }
.faq-answer a:hover { color:var(--rust); }

/* ---------- FILTER TABS ---------- */
.filter-tabs {
  display:flex; gap:8px; flex-wrap:wrap; margin-bottom:40px;
}
.filter-tab {
  font-family:'Barlow Condensed',sans-serif; font-weight:700;
  font-size:13px; letter-spacing:2px; text-transform:uppercase;
  padding:10px 24px; border:2px solid var(--brown-dark);
  background:none; color:var(--brown-dark); cursor:pointer;
  transition:all .2s; min-height:44px;
}
.filter-tab:hover, .filter-tab.active {
  background:var(--brown-dark); color:var(--cream);
}

/* ---------- SERVICE INCLUDES LIST ---------- */
.service-includes {
  list-style:none; margin-top:16px; padding:0;
  border-top:1px solid rgba(245,236,215,.15); padding-top:16px;
}
.service-includes li {
  font-size:13px; color:rgba(245,236,215,.5); line-height:1.8;
  transition:color .35s;
}
.service-card:hover .service-includes li { color:rgba(255,255,255,.75); }

/* ---------- GALLERY PREVIEW (Home Page) ---------- */
.gallery-grid--preview {
  grid-template-columns:repeat(4,1fr);
}
.gallery-grid--preview .gallery-item:nth-child(1) {
  grid-column:span 1; grid-row:span 1; aspect-ratio:1; min-height:auto;
}

/* ---------- BOOKING QUICK FAQ ---------- */
.booking-quick-faq {
  margin-top:36px; padding:24px;
  background:rgba(255,255,255,.08);
  border:1px solid rgba(255,255,255,.15);
}
.booking-faq-title {
  font-family:'Bebas Neue',sans-serif; font-size:22px;
  color:#fff; letter-spacing:2px; margin-bottom:16px;
}
.booking-faq-item {
  font-size:14px; color:rgba(255,255,255,.65); line-height:1.7;
  margin-bottom:8px;
}
.booking-faq-item strong { color:rgba(255,255,255,.85); }

/* ---------- GALLERY ITEM FILTER ANIMATION ---------- */
.gallery-item[data-category] {
  transition:opacity .4s ease, transform .4s ease;
}
.gallery-item.filtered-out {
  opacity:0; transform:scale(.9);
  pointer-events:none; position:absolute; visibility:hidden;
}

/* ============================================================
   RESPONSIVE — NEW COMPONENTS
   ============================================================ */

@media (max-width:1100px) {
  .page-header { padding:120px 48px 60px; }
  .page-header-title { font-size:clamp(44px,6vw,80px); }
  .cta-banner { padding:60px 48px; }
  .cta-banner-inner { padding:48px 40px; }
  .stats-bar { padding:40px 48px; }
  .stats-bar-inner { grid-template-columns:repeat(4,1fr); gap:24px; }
  .process-steps { grid-template-columns:repeat(2,1fr); }
  .reviews-grid { grid-template-columns:repeat(2,1fr); gap:20px; }
  .faq-section { padding:60px 48px; }
}

@media (max-width:1024px) {
  .page-header { padding:100px 32px 48px; }
  .page-header-title { font-size:clamp(36px,5vw,64px); }
  .page-header-sub { font-size:15px; }
  .cta-banner { padding:48px 32px; }
  .cta-banner-inner { padding:40px 32px; }
  .cta-banner-title { font-size:clamp(32px,4vw,56px); }
  .stats-bar { padding:36px 32px; }
  .stats-bar-inner { grid-template-columns:repeat(2,1fr); gap:20px; }
  .stats-bar-item:nth-child(2)::after { display:none; }
  .stats-bar-num { font-size:44px; }
  .process-steps { grid-template-columns:repeat(2,1fr); gap:2px; }
  .process-step { padding:32px 24px; }
  .process-step-num { font-size:56px; }
  .reviews-grid { grid-template-columns:1fr; gap:18px; }
  .faq-section { padding:48px 32px; }
  .faq-category-title { font-size:26px; }
  .faq-question { font-size:16px; padding:16px 0; }
  .timeline { padding-left:40px; }
  .timeline::before { left:12px; }
  .timeline-dot { left:-36px; width:14px; height:14px; }
  .gallery-grid--preview { grid-template-columns:repeat(2,1fr); }
}

@media (max-width:768px) {
  .page-header { padding:90px 20px 40px; }
  .page-header-title { font-size:clamp(28px,5vw,48px); margin-bottom:16px; }
  .page-header-sub { font-size:14px; }
  .cta-banner { padding:40px 20px; }
  .cta-banner-inner { padding:32px 24px; clip-path:polygon(0 0, calc(100% - 16px) 0, 100% 16px, 100% 100%, 16px 100%, 0 calc(100% - 16px)); }
  .cta-banner-title { font-size:clamp(26px,4vw,44px); }
  .cta-banner-sub { font-size:14px; }
  .stats-bar { padding:32px 20px; }
  .stats-bar-inner { grid-template-columns:repeat(2,1fr); gap:16px; }
  .stats-bar-num { font-size:36px; }
  .stats-bar-label { font-size:10px; letter-spacing:2px; }
  .stats-bar-item::after { display:none; }
  .process-steps { grid-template-columns:1fr; }
  .process-step { padding:24px 18px; }
  .process-step-num { font-size:48px; }
  .process-step-title { font-size:16px; }
  .process-step-desc { font-size:13px; }
  .faq-section { padding:40px 20px; }
  .faq-category-title { font-size:22px; }
  .faq-question { font-size:15px; }
  .timeline { padding-left:32px; }
  .timeline::before { left:8px; }
  .timeline-dot { left:-28px; width:12px; height:12px; }
  .timeline-year { font-size:22px; }
  .timeline-heading { font-size:16px; }
  .timeline-desc { font-size:13px; }
  .timeline-item { margin-bottom:32px; }
  .filter-tabs { gap:6px; margin-bottom:28px; }
  .filter-tab { font-size:11px; padding:8px 16px; min-height:40px; }
  .gallery-grid--preview { grid-template-columns:repeat(2,1fr); gap:3px; }
  .booking-quick-faq { padding:18px; margin-top:24px; }
  .booking-faq-title { font-size:18px; }
  .booking-faq-item { font-size:13px; }
}

@media (max-width:600px) {
  .page-header { padding:80px 16px 32px; }
  .page-header-title { font-size:clamp(24px,5vw,40px); }
  .page-header-sub { font-size:13px; }
  .cta-banner { padding:32px 16px; }
  .cta-banner-inner { padding:24px 16px; }
  .cta-banner-title { font-size:clamp(22px,5vw,36px); }
  .stats-bar { padding:24px 16px; }
  .stats-bar-num { font-size:30px; }
  .stats-bar-label { font-size:9px; }
  .faq-section { padding:32px 16px; }
  .faq-category-title { font-size:18px; }
  .faq-question { font-size:14px; }
  .faq-answer p { font-size:13px; }
  .faq-answer li { font-size:13px; }
  .timeline { padding-left:28px; }
  .filter-tab { font-size:10px; padding:6px 12px; }
}

@media (max-width:400px) {
  .page-header { padding:70px 12px 24px; }
  .page-header-title { font-size:clamp(20px,5vw,32px); }
  .stats-bar-inner { grid-template-columns:1fr 1fr; gap:12px; }
  .stats-bar-num { font-size:24px; }
}

/* ═══ PRINT STYLES ═══ */
@media print {
  nav, .mobile-menu, .wa-float, .scroll-hint, .marquee-strip { display:none !important; }
  body { background:#fff; }
  section { page-break-inside:avoid; }
}

