/* ============================================================
   SUMADHURA PANORAMA — style.css  v2.0
   Palette: Gold #C9A14A · Navy #0B1C2C · Beige #F8F5F0
   Fonts: Cormorant Garamond + DM Sans
============================================================ */
:root { --gold:#C9A14A; --gold-lt:#e2bc72; --gold-dk:#9e7c36; --gold-glow:rgba(201,161,74,.35); --gold-glass:rgba(201,161,74,.12); --navy:#0B1C2C; --navy-mid:#122338; --navy-lt:#1a3048; --beige:#F8F5F0; --beige-dk:#EDE8E0; --white:#FFFFFF; --w80:rgba(255,255,255,.8); --w50:rgba(255,255,255,.5); --w15:rgba(255,255,255,.15); --body-c:#4a5568; --navy-txt:#1a3048; --font-h:'Cormorant Garamond',Georgia,serif; --font-b:'DM Sans',sans-serif; --r:18px; --r-sm:10px; --ease:cubic-bezier(.23,1,.32,1); --tx:.4s var(--ease); --shadow-dk:0 20px 60px rgba(0,0,0,.4); --shadow-sm:0 8px 28px rgba(0,0,0,.14); }
*,*::before,*::after { box-sizing:border-box; margin:0; padding:0 }
html { scroll-behavior:smooth; -webkit-text-size-adjust:100% }
body { background:var(--beige); color:var(--navy-txt); font-family:var(--font-b); font-size:15px; line-height:1.7; overflow-x:hidden }
img { max-width:100%; display:block }
a { text-decoration:none; color:inherit }
button { cursor:pointer; border:none; background:none; font-family:var(--font-b) }
::-webkit-scrollbar { width:5px }
::-webkit-scrollbar-track { background:var(--beige) }
::-webkit-scrollbar-thumb { background:var(--gold); border-radius:10px }
/* ── TYPOGRAPHY ── */
.section-eyebrow { display:inline-block; font-family:var(--font-b); font-size:11px; font-weight:600; letter-spacing:4px; text-transform:uppercase; color:var(--gold); border:1px solid var(--gold-glass); background:var(--gold-glass); padding:5px 16px; border-radius:50px; margin-bottom:16px }
.section-eyebrow.light { color:var(--gold-lt); border-color:rgba(201,161,74,.3); background:rgba(201,161,74,.12) }
.section-title { font-family:var(--font-h); font-size:clamp(28px,4vw,50px); font-weight:700; line-height:1.15; color:var(--navy); margin-bottom:18px }
.section-title em { color:var(--gold); font-style:italic }
.section-title.light { color:var(--white) }
.section-title.light em { color:var(--gold-lt) }
.section-sub { color:var(--body-c); font-size:15px; max-width:520px; margin:0 auto }
.section-sub.light { color:var(--w80) }
.body-txt { color:var(--body-c); line-height:1.85; margin-bottom:12px }
.body-txt.light { color:var(--w80) }
.text-gold { color:var(--gold) }
.section-gap { padding:100px 0 }
/* ── BUTTONS ── */
.btn-primary { display:inline-flex; align-items:center; background:linear-gradient(135deg,var(--gold),var(--gold-dk)); color:var(--navy); font-family:var(--font-b); font-weight:600; font-size:14px; padding:13px 30px; border-radius:50px; box-shadow:0 4px 20px var(--gold-glow); transition:var(--tx); position:relative; overflow:hidden }
.btn-primary:hover { transform:translateY(-3px); box-shadow:0 8px 34px rgba(201,161,74,.55) }
.btn-primary-full { display:block; width:100%; background:linear-gradient(135deg,var(--gold),var(--gold-dk)); color:var(--navy); font-family:var(--font-b); font-weight:600; font-size:14px; padding:14px; border-radius:50px; text-align:center; box-shadow:0 4px 20px var(--gold-glow); transition:var(--tx); position:relative; overflow:hidden }
.btn-primary-full:hover { transform:translateY(-3px); box-shadow:0 8px 34px rgba(201,161,74,.5) }
.ripple-btn { overflow:hidden; position:relative }
.ripple-btn::after { content:''; position:absolute; inset:0; background:radial-gradient(circle at center,rgba(255,255,255,.3) 0%,transparent 70%); opacity:0; transform:scale(0); transition:transform .5s,opacity .5s }
.ripple-btn:active::after { transform:scale(3); opacity:1; transition:0s }
@keyframes pulse-glow { 0%,100% { box-shadow:0 4px 20px var(--gold-glow) } 50% { box-shadow:0 4px 40px rgba(201,161,74,.7),0 0 0 8px rgba(201,161,74,.1) } }
.pulse-btn { animation:pulse-glow 2.5s infinite }

/* ── HEADER ── */
.site-header { position:fixed; top:0; left:0; right:0; z-index:1000; background:rgba(11,28,44,.45); backdrop-filter:blur(22px); -webkit-backdrop-filter:blur(22px); border-bottom:1px solid rgba(201,161,74,.18); transition:background .4s }

.site-header.scrolled { background:rgba(11,28,44,.96) }
.site-header {
  height: 70px;
}

.hdr-inner {
  height: 100%;
}
.hdr-inner { display:flex; align-items:center; justify-content:space-between; padding:12px 24px; max-width:1300px; margin:0 auto; gap:16px }
.logo-dev { display:flex; align-items:center }
.hdr-logo { height:44px; width:auto; object-fit:contain; filter:brightness(0) invert(1) }

/* Propsource broker logo - slightly bigger */
.hdr-logo-broker { height:86px; width:auto; object-fit:contain; filter:brightness(0) invert(1) }
.logo-broker { display:flex; align-items:center }

.logo-mark { width:38px; height:38px; border-radius:8px; background:linear-gradient(135deg,var(--gold),var(--gold-dk)); display:flex; align-items:center; justify-content:center; font-size:20px; color:var(--navy); flex-shrink:0 }
.logo-name { font-family:var(--font-h); font-weight:700; font-size:17px; color:var(--gold); letter-spacing:2px; line-height:1 }
.logo-sub-txt { font-size:9px; letter-spacing:3px; text-transform:uppercase; color:var(--w50); line-height:1 }
.main-nav { display:flex; align-items:center; gap:26px; flex-wrap: wrap; }
.main-nav a { font-size:13px; font-weight:500; letter-spacing:.5px; color:var(--w80); position:relative; transition:color .3s }
.main-nav a::after { content:''; position:absolute; bottom:-3px; left:0; right:0; height:1.5px; background:var(--gold); transform:scaleX(0); transition:transform .3s; transform-origin:left }
.main-nav a:hover { color:var(--gold) }
.main-nav a:hover::after { transform:scaleX(1) }
.hdr-right { display:flex; align-items:center; gap:14px }

/* ── HEADER CALL BUTTON - DESKTOP (icon + number) ── */
.hdr-call-desktop {
  display:flex;
  align-items:center;
  gap:8px;
  background:linear-gradient(135deg,var(--gold),var(--gold-dk));
  color:var(--navy) !important;
  font-family:var(--font-b);
  font-weight:700;
  font-size:13px;
  padding:9px 18px;
  border-radius:50px;
  box-shadow:0 0 12px var(--gold-glow), 0 0 24px rgba(201,161,74,.25);
  transition:var(--tx);
  text-decoration:none;
  white-space:nowrap;
  animation:pulse-glow 2.5s infinite;
}
.hdr-call-desktop i { font-size:14px; color:var(--navy) !important }
.hdr-call-desktop:hover { transform:translateY(-2px); box-shadow:0 0 20px rgba(201,161,74,.7), 0 0 40px rgba(201,161,74,.4) }

/* ── HEADER CALL BUTTON - MOBILE (icon only) ── */
.hdr-call-mobile {
  display:flex;
  align-items:center;
  justify-content:center;
  width:40px;
  height:40px;
  border-radius:50%;
  background:linear-gradient(135deg,var(--gold),var(--gold-dk));
  color:var(--navy) !important;
  font-size:17px;
  box-shadow:0 0 12px var(--gold-glow), 0 0 24px rgba(201,161,74,.25);
  transition:var(--tx);
  text-decoration:none;
  animation:pulse-glow 2.5s infinite;
}
.hdr-call-mobile i { color:var(--navy) !important }
.hdr-call-mobile:hover { transform:scale(1.08); box-shadow:0 0 20px rgba(201,161,74,.7), 0 0 40px rgba(201,161,74,.4) }

/* Remove old float-call (no longer used but kept for safety) */
.float-call { display:none !important }

.btn-enq { display:inline-flex; align-items:center; background:linear-gradient(135deg,var(--gold),var(--gold-dk)); color:var(--navy); font-weight:600; font-size:13px; padding:10px 22px; border-radius:50px; box-shadow:0 4px 16px var(--gold-glow); transition:var(--tx) }
.btn-enq:hover { transform:translateY(-2px) }
.nav-toggle { display:none; flex-direction:column; gap:5px; width:36px; height:36px; justify-content:center; align-items:center; border-radius:8px; border:1px solid rgba(201,161,74,.3) }
.nav-toggle span { display:block; width:18px; height:2px; background:var(--gold); transition:.3s; border-radius:2px }
.nav-toggle.open span:nth-child(1) { transform:rotate(45deg) translate(5px,5px) }
.nav-toggle.open span:nth-child(2) { opacity:0 }
.nav-toggle.open span:nth-child(3) { transform:rotate(-45deg) translate(5px,-5px) }
.mobile-drawer { display:none; flex-direction:column; padding:20px 24px 24px; background:rgba(11,28,44,.97); border-top:1px solid rgba(201,161,74,.12) }
.mobile-drawer.open { display:flex }
.drawer-link { font-size:16px; font-weight:500; color:var(--w80); padding:12px 0; border-bottom:1px solid rgba(255,255,255,.06); transition:color .3s }
.drawer-link:hover { color:var(--gold) }

/* ── HERO ── */
.hero-wrap { position:relative; height:auto; min-height:100vh; display:flex; align-items:center; padding:80px 20px; overflow:hidden }
.hero-bg-slider { position:absolute; inset:0 }
.hbs-slide { position:absolute; inset:0; background-size:cover; background-position:center; opacity:0; transition:opacity 1.2s ease; transform:scale(1.07) }
.hbs-slide.active { opacity:1; animation:heroZoom 8s ease-out forwards }
@keyframes heroZoom { from { transform:scale(1.07) } to { transform:scale(1) } }
.typing-text { overflow:hidden; white-space:nowrap; border-right:3px solid var(--gold); width:0; animation:typing 3s steps(30,end) forwards, blink 0.8s infinite; }
.hero-title { background:linear-gradient(90deg,#C9A14A,#fff,#C9A14A); background-size:200%; -webkit-background-clip:text; -webkit-text-fill-color:transparent; animation:shimmer 3s linear infinite; }
@keyframes shimmer { 0% { background-position:-200%; } 100% { background-position:200%; } }
.hero-wrap::before { content:""; position:absolute; width:100%; height:100%; background:radial-gradient(circle,rgba(255,255,255,0.08) 2px,transparent 2px); background-size:40px 40px; animation:moveBg 10s linear infinite; z-index:1; }
@keyframes moveBg { from { transform:translateY(0); } to { transform:translateY(-100px); } }
.hero-overlay { position:absolute; inset:0; background:linear-gradient(135deg,rgba(11,28,44,.88) 0%,rgba(11,28,44,.55) 50%,rgba(201,161,74,.15) 100%); z-index:1 }
.hero-center { position:relative; z-index:2; text-align:center; padding:0 10px; max-width:860px; margin:0 auto }
.hero-eyebrow { display:inline-block; font-size:10px; letter-spacing:4px; text-transform:uppercase; font-weight:600; color:var(--gold-lt); border:1px solid rgba(201,161,74,.35); background:rgba(201,161,74,.1); padding:6px 20px; border-radius:50px; margin-bottom:24px }
.hero-title { font-family:var(--font-h); display:block; font-weight:700; line-height:1.05; color:var(--white); margin-bottom:16px }
.ht1 { display:block; font-size:clamp(46px,8vw,90px); animation:slideUp .9s .1s both }
.ht2 { display:block; font-size:clamp(40px,7vw,80px); font-style:italic; color:var(--gold-lt); animation:slideUp .9s .3s both }
@keyframes slideUp { from { opacity:0; transform:translateY(40px) } to { opacity:1; transform:translateY(0) } }
.hero-tagline { font-size:clamp(13px,2vw,17px); color:var(--w80); letter-spacing:2px; text-transform:uppercase; margin-bottom:24px; animation:fadeIn 1s .5s both }
@keyframes fadeIn { from { opacity:0 } to { opacity:1 } }
.hero-price-pill { display:inline-flex; align-items:center; gap:12px; background:rgba(201,161,74,.15); border:1px solid rgba(201,161,74,.35); padding:10px 28px; border-radius:50px; margin-bottom:18px; animation:fadeIn 1s .7s both }
.hpp-from { font-size:11px; letter-spacing:2px; text-transform:uppercase; color:var(--w50) }
.hpp-val {  font-size:clamp(22px,3vw,30px); font-weight:700; background:linear-gradient(135deg,var(--gold-lt),var(--gold)); -webkit-background-clip:text; -webkit-text-fill-color:transparent; background-clip:text }
.hero-tags-row { display:flex; gap:10px; justify-content:center; flex-wrap:wrap; margin-bottom:24px; animation:fadeIn 1s .8s both }
.htag { font-size:12px; font-weight:500; color:var(--w80); background:rgba(255,255,255,.1); border:1px solid rgba(255,255,255,.2); padding:5px 14px; border-radius:50px }
.hero-cta-row { display:flex; gap:14px; justify-content:center; flex-wrap:wrap; animation:fadeIn 1s .9s both; margin-bottom:18px }
.btn-hero-primary { display:inline-flex; align-items:center; background:linear-gradient(135deg,var(--gold),var(--gold-dk)); color:var(--navy); font-weight:700; font-size:14px; padding:14px 32px; border-radius:50px; box-shadow:0 6px 28px var(--gold-glow); transition:var(--tx); position:relative; overflow:hidden }
.btn-hero-primary:hover { transform:translateY(-4px); box-shadow:0 12px 36px rgba(201,161,74,.55) }
.btn-hero-ghost { display:inline-flex; align-items:center; background:transparent; border:1.5px solid rgba(255,255,255,.4); color:var(--white); font-weight:600; font-size:14px; padding:13px 28px; border-radius:50px; transition:var(--tx) }
.btn-hero-ghost:hover { border-color:var(--gold); color:var(--gold); background:rgba(201,161,74,.08) }
.hero-rera { font-size:10px; letter-spacing:1px; color:#FFFFFF; animation:fadeIn 1s 1s both }
.hero-slide-dots { position:absolute; bottom:190px; left:50%; transform:translateX(-50%); z-index:5; display:flex; gap:8px }
.hsd { width:8px; height:8px; border-radius:50%; background:rgba(255,255,255,.3); transition:.3s; cursor:pointer }
.hsd.active { background:var(--gold); width:24px; border-radius:4px }
.hero-float-form { position:absolute; bottom:0; left:0; right:0; z-index:5; background:rgba(11,28,44,.88); backdrop-filter:blur(16px); -webkit-backdrop-filter:blur(16px); border-top:1px solid rgba(201,161,74,.2); padding:18px 24px }
.hff-wrap { max-width:1100px; margin:0 auto; display:flex; align-items:center; gap:20px; flex-wrap:wrap }
.hff-label { display:flex; align-items:center; gap:8px; font-size:13px; font-weight:600; color:var(--gold-lt); white-space:nowrap; flex-shrink:0; padding-right:20px; border-right:1px solid rgba(201,161,74,.2) }
.hff-label i { font-size:18px; color:var(--gold) }
.hff-form { flex:1; display:flex; gap:12px; align-items:flex-start; flex-wrap:wrap }
.hff-field { flex:1; min-width:140px; position:relative }
.hff-field input,.hff-field select { width:100%; background:rgba(255,255,255,.08); border:1px solid rgba(255,255,255,.15); border-radius:var(--r-sm); padding:11px 14px; color:var(--white); font-family:var(--font-b); font-size:13px; outline:none; transition:border-color .3s }
.hff-field input::placeholder { color:rgba(255,255,255,.4) }
.hff-field select option { background:var(--navy-mid); color:var(--white) }
.hff-field input:focus,.hff-field select:focus { border-color:rgba(201,161,74,.6) }
.hff-btn { background:linear-gradient(135deg,var(--gold),var(--gold-dk)); color:var(--navy); font-weight:700; font-size:13px; padding:12px 24px; border-radius:var(--r-sm); display:flex; align-items:center; white-space:nowrap; box-shadow:0 4px 16px var(--gold-glow); transition:var(--tx); flex-shrink:0; position:relative; overflow:hidden }
.hff-btn:hover { transform:translateY(-2px) }

/* ── STATS ── */
.stats-band { background:var(--navy); padding:32px 0; border-bottom:2px solid rgba(201,161,74,.2) }
.sb-grid { display:flex; justify-content:center; align-items:center; flex-wrap:wrap; max-width:900px; margin:0 auto }
.sb-item { flex:1; min-width:140px; display:flex; flex-direction:column; align-items:center; padding:10px 0 }
.sb-num { font-family:var(--font-h); font-size:clamp(34px,4.5vw,52px); font-weight:700; color:var(--gold); line-height:1 }
.sb-sym { font-size:28px; font-weight:700; color:var(--gold) }
.sb-lbl { font-size:11px; letter-spacing:2px; text-transform:uppercase; color:var(--w50); margin-top:4px }
.sb-div { width:1px; height:48px; background:rgba(201,161,74,.2) }

/* ── ABOUT ── */
.about-section { background:var(--beige) }
.about-img-shell { position:relative; padding:24px 24px 40px 24px }
.about-main-img { border-radius:var(--r); width:100%; height:500px; object-fit:cover; box-shadow:var(--shadow-dk); transition:transform .6s }
.about-main-img:hover { transform:scale(1.02) }
.about-float-chip { position:absolute; bottom:16px; right:0; display:flex; align-items:center; gap:10px; background:var(--white); border:1px solid rgba(201,161,74,.3); border-radius:var(--r-sm); padding:14px 20px; box-shadow:var(--shadow-sm) }
.about-float-chip i { font-size:24px; color:var(--gold) }
.about-float-chip strong { display:block; font-size:13px; font-weight:700; color:var(--navy) }
.about-float-chip small { font-size:9px; color:var(--body-c); letter-spacing:1px }
.about-ring-deco { position:absolute; top:-16px; left:-16px; width:100px; height:100px; border:2px solid rgba(201,161,74,.25); border-radius:var(--r); z-index:-1 }
.about-check-grid { display:grid; grid-template-columns:1fr 1fr; gap:12px; margin-top:22px }
.ach { display:flex; align-items:center; gap:10px; font-size:13px; color:var(--navy-txt); font-weight:500 }
.ach i { color:var(--gold); font-size:16px; flex-shrink:0 }

/* ── REASONS ── */
.reasons-section { background:var(--navy); position:relative; overflow:hidden }
.reasons-bg { position:absolute; inset:0; background-image:radial-gradient(rgba(201,161,74,.06) 1.5px,transparent 1.5px); background-size:28px 28px }
.reason-card { background:rgba(255,255,255,.05); border:1px solid rgba(201,161,74,.15); border-radius:var(--r); padding:28px 22px; height:100%; transition:var(--tx) }
.reason-card:hover { background:rgba(201,161,74,.07); border-color:rgba(201,161,74,.4); transform:translateY(-6px); box-shadow:0 20px 50px rgba(0,0,0,.3) }
.rc-icon { width:56px; height:56px; border-radius:50%; background:rgba(201,161,74,.12); border:1px solid rgba(201,161,74,.25); display:flex; align-items:center; justify-content:center; font-size:24px; color:var(--gold); margin-bottom:16px; transition:var(--tx) }
.reason-card:hover .rc-icon { background:var(--gold); color:var(--navy) }
.reason-card h4 { font-family:var(--font-h); font-size:18px; font-weight:600; color:var(--white); margin-bottom:10px }
.reason-card p { font-size:13px; color:var(--w50); line-height:1.7 }

/* ── AMENITIES ── */
.amenities-section { background:var(--beige-dk); position:relative; overflow:hidden }
.amen-pattern { position:absolute; inset:0; background-image:radial-gradient(rgba(201,161,74,.08) 1px,transparent 1px); background-size:22px 22px }
.amen-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:22px }
.amen-card { padding:28px 20px; text-align:center; border-radius:var(--r); border:1px solid rgba(201,161,74,.15); background:var(--white); transition:var(--tx); cursor:default; transform-style:preserve-3d; box-shadow:var(--shadow-sm) }
.amen-card:hover { background:linear-gradient(135deg,var(--beige),var(--white)); border-color:rgba(201,161,74,.5); box-shadow:0 20px 50px rgba(0,0,0,.1),0 0 0 1px rgba(201,161,74,.2); transform:translateY(-6px) }
.amen-icon { width:64px; height:64px; border-radius:50%; background:rgba(201,161,74,.1); border:1px solid rgba(201,161,74,.25); display:flex; align-items:center; justify-content:center; margin:0 auto 14px; transition:var(--tx); overflow:hidden }
.amen-icon img { width:36px; height:36px; object-fit:contain }
.amen-icon i { font-size:26px; color:var(--gold) }
.amen-card:hover .amen-icon { background:var(--gold); border-color:var(--gold); transform:scale(1.1) }
.amen-card:hover .amen-icon img { filter:brightness(0) }
.amen-card:hover .amen-icon i { color:var(--navy) }
.amen-card h4 { font-family:var(--font-h); font-size:16px; font-weight:600; margin-bottom:8px; color:var(--navy) }
.amen-card p { font-size:12px; color:var(--body-c); line-height:1.6 }

/* ── MOBILE SLIDER (shared) ── */
.mobile-slider-wrap { position:relative; overflow:hidden; padding-bottom:52px }
.ms-track { display:flex; transition:transform .45s var(--ease); will-change:transform }
.ms-slide { min-width:100%; padding:0 4px }
.ms-slide .amen-card { margin:0 }
.gallery-track .ms-slide { padding:0 }
.gal-slide-inner { position:relative; border-radius:var(--r); overflow:hidden; height:260px }
.gal-slide-inner img { width:100%; height:100%; object-fit:cover }
.gal-slide-inner .gm-cap { position:absolute; inset:0; background:linear-gradient(to top,rgba(11,28,44,.8) 0%,transparent 55%); display:flex; align-items:flex-end; padding:14px; opacity:1 }
.gal-slide-inner .gm-cap span { font-family:var(--font-h); font-size:14px; font-weight:600; color:var(--white) }
.price-track .ms-slide { padding:0 6px }
.price-track .pc-card { margin:0; transform:none !important }
.ms-controls { position:absolute; bottom:0; left:0; right:0; display:flex; align-items:center; justify-content:center; gap:14px; padding:10px 0 }
.ms-arrow { width:38px; height:38px; border-radius:50%; border:1.5px solid var(--gold); color:var(--gold); display:flex; align-items:center; justify-content:center; font-size:16px; background:transparent; transition:.3s; flex-shrink:0 }
.ms-arrow:hover { background:var(--gold); color:var(--navy) }
.ms-dots { display:flex; gap:7px; align-items:center }
.ms-dot { width:8px; height:8px; border-radius:50%; background:rgba(201,161,74,.3); transition:.3s; cursor:pointer }
.ms-dot.active { background:var(--gold); width:20px; border-radius:4px }

/* ── GALLERY ── */
.gallery-section { background:var(--beige) }
.gallery-mosaic { display:grid; grid-template-columns:repeat(3,1fr); grid-template-rows:280px 280px; gap:14px }
.gm-item { position:relative; overflow:hidden; border-radius:var(--r); cursor:pointer; background:var(--navy-lt) }
.gm-item.gm-wide { grid-column:span 2 }
.gm-item.gm-tall { grid-row:span 2 }
.gm-item img { width:100%; height:100%; object-fit:cover; transition:transform .65s ease }
.gm-item:hover img { transform:scale(1.09) }
.gm-cap { position:absolute; inset:0; background:linear-gradient(to top,rgba(11,28,44,.85) 0%,transparent 55%); display:flex; align-items:flex-end; padding:18px; opacity:0; transition:opacity .4s }
.gm-item:hover .gm-cap { opacity:1 }
.gm-cap span { font-family:var(--font-h); font-size:15px; font-weight:600; color:var(--white); letter-spacing:1px }
.lightbox { position:fixed; inset:0; z-index:9999; background:rgba(0,0,0,.93); display:none; align-items:center; justify-content:center; padding:20px }
.lightbox.open { display:flex }
.lightbox img { max-width:90vw; max-height:84vh; object-fit:contain; border-radius:var(--r-sm); box-shadow:0 0 80px rgba(0,0,0,.8) }
.lb-x { position:absolute; top:20px; right:20px; width:44px; height:44px; border-radius:50%; background:rgba(255,255,255,.1); color:var(--white); font-size:18px; display:flex; align-items:center; justify-content:center; transition:.3s }
.lb-x:hover { background:rgba(201,161,74,.5) }
.lb-arr { position:absolute; top:50%; transform:translateY(-50%); width:48px; height:48px; border-radius:50%; background:rgba(255,255,255,.1); color:var(--white); font-size:20px; display:flex; align-items:center; justify-content:center; transition:.3s }
.lb-prev { left:16px }
.lb-next { right:16px }
.lb-arr:hover { background:rgba(201,161,74,.5) }

/* ── PRICING ── */
.pricing-section { position:relative; overflow:hidden; background:var(--navy-mid) }
.pricing-bg { position:absolute; inset:0; background:radial-gradient(ellipse at 0% 100%,rgba(201,161,74,.1) 0%,transparent 50%),radial-gradient(ellipse at 100% 0%,rgba(201,161,74,.07) 0%,transparent 50%) }
.pricing-row { display:grid; grid-template-columns:repeat(4,1fr); gap:22px; align-items:start }
.pc-card { background:rgba(255,255,255,.04); border:1px solid rgba(255,255,255,.08); border-radius:var(--r); padding:30px 22px; position:relative; transition:var(--tx); box-shadow:0 8px 30px rgba(0,0,0,.3) }
.pc-card:hover { transform:translateY(-10px); border-color:rgba(201,161,74,.4); box-shadow:0 24px 60px rgba(0,0,0,.4) }
.pc-card.pc-featured { border-color:rgba(201,161,74,.4); background:rgba(201,161,74,.07) }
.pcb { position:absolute; top:-13px; left:50%; transform:translateX(-50%); font-size:10px; font-weight:700; letter-spacing:2px; text-transform:uppercase; padding:5px 18px; border-radius:50px; white-space:nowrap; background:rgba(255,255,255,.12); color:var(--white) }
.pcb.featured { background:linear-gradient(135deg,var(--gold),var(--gold-dk)); color:var(--navy) }
.pcb.ultra { background:linear-gradient(135deg,#999,#555); color:var(--white) }
.pc-type { font-family:var(--font-h); font-size:20px; font-weight:700; color:var(--white); text-align:center; margin:16px 0 10px }
.pc-icon-wrap { font-size:34px; color:var(--gold); text-align:center; margin-bottom:10px }
.pc-area { font-size:11px; letter-spacing:2px; text-transform:uppercase; color:var(--w50); text-align:center; margin-bottom:8px }
.pc-price { font-family:var(--font-h); font-size:clamp(18px,2.5vw,24px); font-weight:700; color:var(--gold); text-align:center; margin-bottom:20px }
.pc-price.pc-soldout { color:#e05c5c; font-size:16px; letter-spacing:2px }
.pc-list { list-style:none; margin-bottom:20px }
.pc-list li { display:flex; align-items:center; gap:10px; font-size:12px; color:var(--w80); padding:7px 0; border-bottom:1px solid rgba(255,255,255,.05) }
.pc-list li:last-child { border:none }
.pc-list i { color:var(--gold); font-size:13px }
.btn-pc { display:block; width:100%; background:transparent; border:1.5px solid rgba(201,161,74,.5); color:var(--gold); font-weight:600; font-size:13px; padding:11px; border-radius:50px; transition:var(--tx); position:relative; overflow:hidden }
.btn-pc:hover { background:var(--gold); color:var(--navy); border-color:var(--gold) }
.pricing-note { text-align:center; font-size:11px; color:rgba(255,255,255,.3); margin-top:26px }

/* ── FLOOR PLANS ── */
.plans-section { background:var(--beige) }
.plan-tabs { display:flex; gap:8px; flex-wrap:wrap; justify-content:center; margin-bottom:32px }
.ptab { padding:10px 22px; border-radius:50px; font-size:13px; font-weight:600; color:var(--body-c); border:1.5px solid rgba(11,28,44,.15); background:transparent; transition:var(--tx) }
.ptab:hover { color:var(--gold); border-color:var(--gold) }
.ptab.active { background:linear-gradient(135deg,var(--gold),var(--gold-dk)); color:var(--navy); border-color:transparent; box-shadow:0 4px 18px var(--gold-glow) }
.plan-stage { border-radius:var(--r); overflow:hidden }
.plan-pane { display:none }
.plan-pane.active { display:block }
.plan-img { width:100%; max-height:560px; object-fit:cover; cursor:zoom-in; transition:transform .4s; border:1px solid rgba(201,161,74,.2); border-radius:var(--r) }
.plan-img:hover { transform:scale(1.015); box-shadow:var(--shadow-dk) }

/* ── LOCATION ── */
.location-section { background:var(--beige-dk) }
.loc-tabs { display:flex; gap:6px; flex-wrap:wrap; margin-bottom:16px }
.ltab { padding:7px 16px; border-radius:50px; font-size:12px; font-weight:600; color:var(--body-c); border:1.5px solid rgba(11,28,44,.12); background:transparent; transition:.3s; cursor:pointer }
.ltab:hover { color:var(--gold); border-color:var(--gold) }
.ltab.active { background:linear-gradient(135deg,var(--gold),var(--gold-dk)); color:var(--navy); border-color:transparent }
.loc-list { list-style:none; padding:0; margin:0 }
.ll { display:flex; align-items:center; gap:14px; padding:12px 0; border-bottom:1px solid rgba(11,28,44,.07); color:var(--navy-txt); font-size:14px; opacity:0; transform:translateX(-28px); transition:opacity .5s,transform .5s; transition-delay:calc(var(--li,0) * 80ms) }
.ll.visible { opacity:1; transform:translateX(0) }
.ll i { color:var(--gold); font-size:17px; flex-shrink:0 }
.ll strong { color:var(--navy) }
.map-card { border-radius:var(--r); overflow:hidden; box-shadow:var(--shadow-sm); border:1px solid rgba(201,161,74,.2) }
.map-card iframe { display:block }

/* ── FAQ ── */
#faq { padding:80px 0; background:linear-gradient(135deg,var(--beige),var(--white)); position:relative; }
#faq h4 { font-family:var(--font-h); color:var(--navy); font-size:36px; letter-spacing:-1px; }
.accordion-style-02 { max-width:900px; margin:auto; }
.accordion-item { background:rgba(255,255,255,0.7); backdrop-filter:blur(10px); border-radius:var(--r); margin-bottom:15px; overflow:hidden; box-shadow:var(--shadow-sm); transition:var(--tx); }
.accordion-item:hover { transform:translateY(-5px); box-shadow:0 20px 40px rgba(0,0,0,0.15); }
.accordion-item.active-accordion { border:1px solid var(--gold); box-shadow:0 0 20px var(--gold-glow); }
.accordion-header { padding:18px 20px; cursor:pointer; transition:var(--tx); }
.accordion-title { display:flex; align-items:center; justify-content:space-between; font-family:var(--font-b); color:var(--navy); }
.accordion-title i { transition:transform 0.3s ease; color:var(--gold); }
.accordion-item.active-accordion i { transform:rotate(180deg); }
.accordion-body { padding:0 20px 20px; font-size:15px; color:var(--body-c); line-height:1.6; animation:fadeIn 0.5s ease; }
.accordion-header a { display:block; width:100%; text-decoration:none; }
.accordion-title { display:flex; align-items:center; justify-content:space-between; gap:10px; }
.accordion-title span { flex:1; text-align:left; font-weight:600; color:var(--navy); }
.accordion-title i { margin-left:auto; color:var(--gold); font-size:18px; transition:transform 0.3s ease; }
.accordion-item.active-accordion .accordion-title i { transform:rotate(180deg); }
.accordion-header { padding:18px 20px; cursor:pointer; }
.accordion-body { padding:0 20px 20px; }
.accordion-item:hover { transform:translateY(-3px); transition:0.3s ease; }
#faq p { color:var(--navy); }
@media (max-width:768px) { #faq { padding:50px 15px; } .accordion-header { padding:15px; } .accordion-title span { font-size:15px; } }

/* ── CONTACT ── */
.contact-section { position:relative; padding:100px 0; background:var(--navy) }
.contact-overlay { position:absolute; inset:0; background:url('https://images.unsplash.com/photo-1600607687939-ce8a6c25118c?w=1600&q=80') center/cover no-repeat; opacity:.06 }
.contact-channels { display:flex; flex-direction:column; gap:16px }
.cc-item { display:flex; align-items:center; gap:14px; color:var(--white); transition:var(--tx) }
.cc-item:hover { transform:translateX(6px) }
.cc-icon { width:46px; height:46px; border-radius:50%; flex-shrink:0; background:rgba(201,161,74,.12); border:1px solid rgba(201,161,74,.3); display:flex; align-items:center; justify-content:center; font-size:18px; color:var(--gold); transition:var(--tx) }
.cc-icon.green { background:rgba(37,211,102,.1); border-color:rgba(37,211,102,.3); color:#25d366 }
.cc-item:hover .cc-icon { background:var(--gold); color:var(--navy); border-color:var(--gold) }
.cc-item small { display:block; font-size:10px; letter-spacing:2px; text-transform:uppercase; color:var(--w50) }
.cc-item strong { font-size:14px; color:var(--white) }
.cfb { background:var(--white); border-radius:var(--r); padding:36px 32px; box-shadow:var(--shadow-dk); border:1px solid rgba(201,161,74,.15) }
.cfb-title { font-family:var(--font-h); font-size:22px; font-weight:700; color:var(--navy); margin-bottom:24px }
.cf-field { display:block; width:100%; background:var(--beige); border:1.5px solid rgba(11,28,44,.1); border-radius:var(--r-sm); padding:12px 16px; color:var(--navy); font-family:var(--font-b); font-size:14px; outline:none; transition:.3s }
.cf-field::placeholder { color:var(--body-c) }
.cf-field option { background:var(--white) }
.cf-field:focus { border-color:var(--gold); background:var(--white); box-shadow:0 0 0 3px rgba(201,161,74,.12) }
.cf-field.invalid { border-color:#e05c5c !important }
/* ===== ABOUT SECTION ===== */
.about-sec {
  padding: 80px 0;
  background: linear-gradient(135deg, #F8F5F0, #ffffff);
}

/* Title */
.about-title {
  font-size: 38px;
  font-weight: 600;
  color: var(--navy);
  margin-bottom: 20px;
}

/* Content */
.about-content p {
  color: var(--body-c);
  line-height: 1.7;
  margin-bottom: 15px;
}

/* IMAGE WRAP */
.about-img-wrap {
  position: relative;
  overflow: hidden;
  border-radius: 16px;
  cursor: pointer;
  transition: 0.4s ease;
}

/* IMAGE */
.about-img-wrap img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: 0.5s ease;
}

/* HOVER ZOOM */
.about-img-wrap:hover img {
  transform: scale(1.1);
}

/* PLAY BUTTON */
.play-btn {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  background: rgba(201,161,74,0.9);
  color: #fff;
  padding: 18px;
  border-radius: 50%;
  font-size: 22px;
  box-shadow: 0 0 20px rgba(201,161,74,0.6);
  animation: pulse 2s infinite;
}

/* PULSE ANIMATION */
@keyframes pulse {
  0% { box-shadow: 0 0 10px rgba(201,161,74,0.5); }
  50% { box-shadow: 0 0 25px rgba(201,161,74,0.9); }
  100% { box-shadow: 0 0 10px rgba(201,161,74,0.5); }
}

/* SCROLL ANIMATION */
.rv-up {
  opacity: 0;
  transform: translateY(40px);
  transition: 0.6s ease;
}

.rv-up.active {
  opacity: 1;
  transform: translateY(0);
}
.btn-auth {
  display: inline-block;
  padding: 12px 28px;
  font-size: 14px;
  font-weight: 600;
  color: #0B1C2C;
  background: linear-gradient(135deg, #C9A14A, #e2bc72);
  border-radius: 30px;
  text-decoration: none;
  transition: 0.3s ease;

  /* glow */
  box-shadow: 0 0 12px rgba(201,161,74,0.4);
}

/* Hover */
.btn-auth:hover {
  transform: translateY(-3px);
  box-shadow: 0 0 20px rgba(201,161,74,0.8);
  color: #000;
}
/* MOBILE */
@media(max-width:768px){
  .about-title {
    font-size: 26px;
  }

  .about-sec {
    padding: 50px 15px;
  }
}
/* ── FORM HELPERS ── */
.fcg { margin-bottom:14px; position:relative }
.fcg input,.fcg select { display:block; width:100%; background:rgba(255,255,255,.08); border:1px solid rgba(255,255,255,.15); border-radius:var(--r-sm); padding:13px 16px; color:var(--white); font-family:var(--font-b); font-size:14px; outline:none; transition:.3s }
.fcg input::placeholder { color:rgba(255,255,255,.35) }
.fcg input:focus { border-color:rgba(201,161,74,.6); box-shadow:0 0 0 3px rgba(201,161,74,.1) }
.fcg input.invalid { border-color:#e05c5c !important }
.ferr { display:none; font-size:11px; color:#e05c5c; margin-top:4px }
.ferr.show { display:block }

/* ── POPUP ── */
.popup-overlay { position:fixed; inset:0; z-index:10000; background:rgba(11,28,44,.85); backdrop-filter:blur(10px); display:none; align-items:center; justify-content:center; padding:20px }
.popup-overlay.open { display:flex; animation:fadeO .4s }
@keyframes fadeO { from { opacity:0 } to { opacity:1 } }
.popup-card { background:var(--white); border-radius:24px; padding:38px 34px; width:100%; max-width:420px; position:relative; box-shadow:0 30px 80px rgba(0,0,0,.4); border:1px solid rgba(201,161,74,.2); animation:popUp .5s cubic-bezier(.34,1.56,.64,1) }
@keyframes popUp { from { opacity:0; transform:scale(.85) } to { opacity:1; transform:scale(1) } }
.popup-close { position:absolute; top:16px; right:16px; width:36px; height:36px; border-radius:50%; background:rgba(11,28,44,.07); color:var(--navy); font-size:14px; display:flex; align-items:center; justify-content:center; transition:.3s }
.popup-close:hover { background:rgba(201,161,74,.2); color:var(--gold) }
.popup-eyebrow { display:inline-block; font-size:10px; font-weight:600; letter-spacing:3px; text-transform:uppercase; color:var(--gold); background:rgba(201,161,74,.1); padding:4px 14px; border-radius:50px; border:1px solid rgba(201,161,74,.25); margin-bottom:10px }
.popup-logo { height:36px; width:auto; object-fit:contain; margin-bottom:12px }
.popup-title { font-family:var(--font-h); font-size:26px; font-weight:700; color:var(--navy); margin-bottom:6px }
.popup-desc { font-size:13px; color:var(--body-c); margin-bottom:18px }
.popup-note { font-size:11px; color:var(--body-c); text-align:center; margin-top:12px }
.popup-card .fcg input { background:var(--beige); border-color:rgba(11,28,44,.12); color:var(--navy) }
.popup-card .fcg input::placeholder { color:var(--body-c) }
.popup-card .fcg input:focus { border-color:var(--gold) }

/* ── FOOTER ── */
.site-footer { background:var(--navy) }
.footer-body { padding:70px 0 50px; border-bottom:1px solid rgba(255,255,255,.06) }
.footer-brand { display:flex; align-items:center; gap:10px; margin-bottom:18px }
.footer-logo-img { height:44px; width:auto; object-fit:contain; filter:brightness(0) invert(1) }
.footer-bio { font-size:13px; color:var(--w50); line-height:1.8; margin-bottom:22px }
.social-row { display:flex; gap:10px }
.soc { width:36px; height:36px; border-radius:50%; border:1px solid rgba(255,255,255,.12); display:flex; align-items:center; justify-content:center; font-size:16px; color:var(--w50); transition:var(--tx) }
.soc:hover { border-color:var(--gold); color:var(--gold); background:rgba(201,161,74,.1); box-shadow:0 0 14px var(--gold-glow) }
.footer-head { font-family:var(--font-h); font-size:16px; font-weight:600; color:var(--gold); margin-bottom:18px }
.footer-nav { list-style:none; padding:0; margin:0 }
.footer-nav li { margin-bottom:10px }
.footer-nav a { font-size:13px; color:var(--w50); transition:.3s }
.footer-nav a:hover { color:var(--gold); padding-left:5px }
.footer-contact { list-style:none; padding:0; margin:0 }
.footer-contact li { display:flex; align-items:flex-start; gap:10px; font-size:13px; color:var(--w50); margin-bottom:12px }
.footer-contact i { color:var(--gold); flex-shrink:0; margin-top:2px }
.footer-contact a { color:var(--w50); transition:.3s }
.footer-contact a:hover { color:var(--gold) }
.footer-rera-box { background:rgba(201,161,74,.08); border:1px solid rgba(201,161,74,.2); border-radius:var(--r-sm); padding:10px 14px }
.footer-rera-box small { display:block; font-size:10px; letter-spacing:2px; text-transform:uppercase; color:var(--w50); margin-bottom:4px }
.footer-rera-box span { font-size:11px; color:var(--gold-lt) }
.footer-bar { padding:18px 0; font-size:12px; color:rgba(255,255,255,.3) }
.footer-rera { font-size:11px }

/* ── MOBILE BAR ── */
.mob-bar { position:fixed; bottom:0; left:0; right:0; z-index:999; display:flex; height:62px; box-shadow:0 -4px 20px rgba(0,0,0,.3) }
.mob-btn { flex:1; display:flex; align-items:center; justify-content:center; gap:8px; font-size:14px; font-weight:700; color:var(--white); transition:filter .2s }
.mob-btn.call { background:#1a6fdb }
.mob-btn.wa { background:#25d366 }
.mob-btn i { font-size:20px }
.mob-btn:active { filter:brightness(.85) }
.float-enq { position:fixed; bottom:76px; right:16px; z-index:998; width:54px; height:54px; border-radius:50%; background:linear-gradient(135deg,var(--gold),var(--gold-dk)); color:var(--navy); font-size:22px; display:flex; align-items:center; justify-content:center; box-shadow:0 6px 24px var(--gold-glow); animation:pulse-glow 2.4s infinite }

/* ── LEGAL MODAL ── */
.legal-modal { position:fixed; inset:0; z-index:10000; background:rgba(11,28,44,.85); backdrop-filter:blur(8px); display:none; align-items:center; justify-content:center; padding:20px }
.legal-modal.open { display:flex }
.legal-box { background:var(--white); border-radius:var(--r); padding:36px 32px; width:100%; max-width:680px; max-height:80vh; overflow-y:auto; position:relative; border:1px solid rgba(201,161,74,.2) }
.legal-heading { font-family:var(--font-h); font-size:24px; color:var(--navy); margin-bottom:18px }
.legal-body { font-size:13px; color:var(--body-c); line-height:1.9 }
.legal-body h5 { font-size:14px; font-weight:700; color:var(--navy); margin:16px 0 8px }

/* ── TOAST ── */
.toast-bar { position:fixed; bottom:80px; left:50%; transform:translateX(-50%) translateY(16px); z-index:20000; background:linear-gradient(135deg,var(--gold),var(--gold-dk)); color:var(--navy); font-weight:700; font-size:13px; padding:14px 28px; border-radius:50px; box-shadow:0 8px 28px var(--gold-glow); opacity:0; transition:opacity .4s,transform .4s; pointer-events:none; white-space:nowrap }
.toast-bar.show { opacity:1; transform:translateX(-50%) translateY(0) }

/* ── SCROLL REVEAL ── */
.rv-up,.rv-left,.rv-right { opacity:0; transition:opacity .8s,transform .8s; transition-delay:var(--d,0ms) }
.rv-up { transform:translateY(48px) }
.rv-left { transform:translateX(-48px) }
.rv-right { transform:translateX(48px) }
.rv-up.vis,.rv-left.vis,.rv-right.vis { opacity:1; transform:translate(0,0) }
.tilt-el { transform-style:preserve-3d; will-change:transform }

/* ── RESPONSIVE ── */
@media(max-width:1200px) { .amen-grid { grid-template-columns:repeat(2,1fr) } .pricing-row { grid-template-columns:repeat(2,1fr) } }
@media(max-width:992px) {
  .main-nav { display:none }
  .nav-toggle { display:flex }
  .section-gap { padding:70px 0 }
  .ht1 { font-size:clamp(40px,9vw,72px) }
  .ht2 { font-size:clamp(34px,8vw,62px) }
  .hff-wrap { flex-direction:column; gap:12px }
  .hff-label { border-right:none; border-bottom:1px solid rgba(201,161,74,.2); padding-right:0; padding-bottom:10px; white-space:normal }
  .gallery-mosaic { grid-template-columns:1fr 1fr; grid-template-rows:auto }
  .gm-item.gm-wide { grid-column:span 2 }
  .gm-item.gm-tall { grid-row:span 1 }
  .sb-div { display:none }
  .sb-item { min-width:50% }
  .hero-slide-dots { bottom:165px }
}
@media(max-width:768px) {
  .section-gap { padding:56px 0 }
  .about-main-img { height:300px }
  .cfb { padding:24px 18px }
  .about-check-grid { grid-template-columns:1fr }
  .plan-tabs { gap:6px }
  .ptab { padding:8px 14px; font-size:12px }
  .pricing-row.d-none { display:none !important }
  .hero-slide-dots { bottom:175px }
}
@media(max-width:576px) {
  .hdr-inner { padding:10px 16px }
  .ht1 { font-size:clamp(34px,10vw,52px) }
  .ht2 { font-size:clamp(28px,9vw,46px) }
  .hero-cta-row { flex-direction:column; align-items:stretch; max-width:280px; margin:0 auto 18px }
  .btn-hero-primary,.btn-hero-ghost { justify-content:center }
  .gallery-mosaic { grid-template-columns:1fr; grid-template-rows:auto }
  .gm-item.gm-wide { grid-column:span 1 }
  .popup-card { padding:26px 18px }
  .section-title { font-size:clamp(24px,7vw,36px) }
  body { padding-bottom:62px }
  .float-enq { bottom:74px }
  .toast-bar { bottom:72px; font-size:12px; padding:12px 20px }
  .hff-form { flex-direction:column }
  .hff-field { min-width:100% }
  .hero-slide-dots { bottom:190px }
  .loc-tabs { gap:4px }
  .ltab { font-size:11px; padding:6px 12px }
}
@media(max-width:380px) { .sb-item { min-width:100% } .plan-tabs { flex-direction:column } .ptab { text-align:center } }
    

  </style>
  <style>
  body {
  overflow-x: hidden;
}
@media(max-width:992px){
  .hdr-inner {
    flex-wrap: wrap;
    gap: 10px;
  }

  .logo-dev {
    flex: 1;
  }

  .hdr-right {
    gap: 8px;
  }

  .logo-broker {
    display: block;
  }
}
@media(max-width:768px){

  .hero-float-form {
    position: relative !important;
    width: 100%;
    left: 0;
    right: 0;
    margin-top: 20px;
  }

  .hff-form {
    flex-direction: column;
  }

  .hff-field {
    width: 100%;
  }

  .hff-btn {
    width: 100%;
    justify-content: center;
  }
}
@media(max-width:992px){
  .amen-grid {
    grid-template-columns: repeat(2,1fr);
  }

  .pricing-row {
    grid-template-columns: repeat(2,1fr);
  }
}

@media(max-width:576px){
  .amen-grid,
  .pricing-row {
    grid-template-columns: 1fr;
  }
  .hdr-call-desktop {
    display:none;
  }

  .hdr-call-mobile {
    display:flex;
  }

  .hdr-inner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 6px;
  }

  .logo-dev {
    display: flex;
    align-items: center;
    gap: 6px;
  }

  .hdr-logo {
    height: 36px;
  }

  .hdr-logo-broker {
    height: 62px;
  }

  .hdr-right {
    gap: 6px;
  }

  .hdr-call-mobile {
    width: 36px;
    height: 36px;
    font-size: 14px;
  }

  .nav-toggle {
    width: 32px;
    height: 32px;
  }

}
@media(max-width:768px){


  .hff-wrap {
    flex-direction: column;
    align-items: stretch;
  }

  .hff-form {
    flex-direction: column;
    width: 100%;
  }

  .hff-field {
    width: 100%;
  }

  .hff-btn {
    width: 100%;
    justify-content: center;
  }
.hero-wrap {
    display: block !important;
    min-height: auto;
    padding-top: 90px;
  }
}
html, body {
  overflow-x: hidden;
}

.hero-wrap {
  overflow: hidden;
}
@media(max-width:576px){

  .hdr-logo-broker {
    height: 62px;   /* पहले 22 था */
    width: auto;
    max-width: 110px;  /* stretch control */
    object-fit: contain;
  }

}
      /* hidden by default */
.more-text {
  display: none;
}

/* when active */
.more-text.show {
  display: inline;
}

#authBtnWrap {
  display: none;
}

#authBtnWrap.show {
  display: block;
}