/*
Theme Name: Shri Vrinda Gokulam
Description: Custom theme for Shri Vrinda Gokulam (shrivrindagokulam.in) — premium 120-yard plotted township in Mahavan, Gokul. Built for Jhopdi.com.
Author: Jhopdi.com
Version: 1.0
Text Domain: gokulam-theme
*/
  :root{
    --white:#FFFFFF;
    --offwhite:#F8F7F4;
    --panel:#FFFFFF;
    --line:#E7E3DA;
    --ink:#1C1A16;
    --ink-soft:#6B6459;
    --orange:#E96E1B;
    --orange-a11y:#B85110;
    --orange-a11y-hover:#A3470E;
    --orange-deep:#B24E0F;
    --blue:#0E7FA6;
    --gold:#AD8331;
    --peacock:#0F6357;
    --shadow: 0 20px 50px -20px rgba(28,26,22,0.18);
    --shadow-sm: 0 10px 24px -12px rgba(28,26,22,0.14);
    --shadow-lift: 0 30px 60px -22px rgba(28,26,22,0.28), 0 8px 18px -10px rgba(28,26,22,0.16);
  }
  *{box-sizing:border-box; margin:0; padding:0;}
  html{scroll-behavior:smooth;}
  body{
    background:var(--white);
    color:var(--ink);
    font-family:'Inter', sans-serif;
    font-weight:400;
    font-size:18px;
    line-height:1.65;
    -webkit-font-smoothing:antialiased;
  }
  h1,h2,h3,h4,h5,h6,.display{
    font-family:'Poppins', sans-serif;
    font-weight:700;
    color:var(--ink);
    line-height:1.15;
    letter-spacing:-0.01em;
  }
  h1{font-size:44px;}
  h2{font-size:32px;}
  h3{font-size:22px;}
  h4{font-size:18px;}
  h5{font-size:16px;}
  h6{font-size:14px;}
  a{color:inherit; text-decoration:none;}
  img{display:block; max-width:100%;}
  .wrap{max-width:1240px; margin:0 auto; padding:0 32px;}
  .eyebrow{
    font-family:'Inter',sans-serif; font-weight:800; font-size:13.5px;
    color:var(--orange-deep); letter-spacing:0.08em; text-transform:uppercase;
  }

  /* ---------- HEADER ---------- */
  header{
    position:sticky; top:0; z-index:60; background:rgba(255,255,255,0.96);
    backdrop-filter:blur(8px); border-bottom:1px solid var(--line);
  }
  .nav{display:flex; align-items:center; justify-content:space-between; padding:14px 32px; max-width:1240px; margin:0 auto;}
  .logo-block{display:flex; align-items:center;}
  .logo-block img{height:56px; width:auto;}
  .nav-links{display:flex; gap:34px; font-size:16px; font-weight:700; color:var(--ink);}
  .nav-links a{position:relative; padding-bottom:4px;}
  .nav-links a:after{content:"";position:absolute;left:0;bottom:0;width:0;height:2px;background:var(--orange);transition:width .25s ease;}
  .nav-links a:hover:after{width:100%;}
  .nav-actions{display:flex; align-items:center; gap:12px;}
  .btn-primary{background:var(--orange-a11y); color:var(--white); padding:15px 30px; font-family:'Inter', sans-serif; font-weight:600; font-size:15.5px; border-radius:6px; border:1px solid var(--orange-a11y); display:inline-block; transition:transform .18s ease, box-shadow .18s ease, background .18s ease; cursor:pointer;}
  .btn-primary:hover{transform:translateY(-2px); box-shadow:var(--shadow-sm); background:var(--orange-a11y-hover); border-color:var(--orange-a11y-hover);}
  .btn-outline{padding:14px 26px; font-family:'Inter', sans-serif; font-weight:600; font-size:15.5px; color:var(--ink); border:1.5px solid var(--ink); border-radius:6px; transition:all .18s ease; cursor:pointer; background:transparent;}
  .btn-outline:hover{background:var(--ink); color:var(--white);}
  .btn-outline.on-dark{color:var(--white); border-color:rgba(255,255,255,0.65);}
  .btn-outline.on-dark:hover{background:var(--white); color:var(--ink);}
  .nav-cta-small{padding:12px 22px; font-size:14.5px;}
  .nav-toggle{display:none; background:none; border:none; cursor:pointer; z-index:60;}
  .nav-toggle span{display:block; width:26px; height:2.5px; background:var(--ink); margin:5px 0; transition:transform .25s ease, opacity .25s ease;}
  .nav-toggle.open span:nth-child(1){transform:translateY(7.5px) rotate(45deg);}
  .nav-toggle.open span:nth-child(2){opacity:0;}
  .nav-toggle.open span:nth-child(3){transform:translateY(-7.5px) rotate(-45deg);}
  .mobile-menu{display:none; position:fixed; top:0; left:0; right:0; bottom:0; background:var(--white); z-index:55; padding:100px 32px 40px; overflow-y:auto; flex-direction:column; gap:6px;}
  .mobile-menu.open{display:flex;}
  .mobile-menu a{font-size:22px; font-weight:700; font-family:'Poppins',sans-serif; padding:16px 0; border-bottom:1px solid var(--line); color:var(--ink);}
  .mobile-menu .btn-primary, .mobile-menu .btn-outline{text-align:center; margin-top:20px;}

  /* ---------- HERO ---------- */
  .hero{position:relative; height:100vh; min-height:760px; max-height:980px; overflow:hidden;}
  .hero .img-crop{position:absolute; inset:0; overflow:hidden;}
  .hero img{width:100%; height:100%; object-fit:cover; object-position:center 58%; animation:heroZoom 26s ease-in-out infinite alternate;}
  @keyframes heroZoom{ from{transform:scale(1);} to{transform:scale(1.045);} }
  .hero-overlay{position:absolute; inset:0;
    background:
      linear-gradient(100deg, rgba(8,6,4,0.72) 0%, rgba(8,6,4,0.38) 38%, rgba(8,6,4,0.05) 62%, transparent 80%),
      linear-gradient(180deg, rgba(14,11,7,0.05) 0%, rgba(14,11,7,0.18) 42%, rgba(9,7,4,0.88) 100%);
  }
  .hero-content{position:absolute; left:0; right:0; top:150px; bottom:0; padding:0 0 120px; color:var(--white); display:flex; flex-direction:column; justify-content:flex-end; align-items:flex-start; text-align:left;}
  .hero-content .wrap{margin-left:auto; margin-right:auto; width:100%; text-align:left;}
  .hero-tag{display:inline-flex; align-items:center; gap:8px; background:rgba(255,255,255,0.14); backdrop-filter:blur(6px); border:1px solid rgba(255,255,255,0.4); padding:9px 20px 9px 14px; border-radius:30px; font-size:13px; font-weight:700; letter-spacing:0.06em; text-transform:uppercase; margin-bottom:26px; margin-left:0; margin-right:auto;}
  .hero-tag .dot{width:7px; height:7px; border-radius:50%; background:var(--orange); box-shadow:0 0 0 3px rgba(233,110,27,0.35); flex-shrink:0;}
  .hero h1{font-family:'Poppins',sans-serif; font-style:italic; font-weight:700; font-size:clamp(38px,5.4vw,66px); color:var(--white); max-width:16ch; margin-bottom:22px; margin-left:0; margin-right:auto; text-shadow:0 4px 24px rgba(0,0,0,0.4); letter-spacing:-0.01em; text-align:left;}
  .hero p.lede{font-size:19.5px; color:rgba(255,255,255,0.92); max-width:50ch; margin-bottom:36px; margin-left:0; margin-right:auto; line-height:1.6; text-align:left;}
  .hero-actions{display:flex; gap:16px; flex-wrap:wrap; justify-content:flex-start;}

  /* ---------- USP BAND ---------- */
  .usp-band{padding:0; margin-top:-88px; position:relative; z-index:10;}
  .usp-card{
    background:var(--white); border-radius:14px; box-shadow:var(--shadow);
    display:grid; grid-template-columns:repeat(4,1fr); overflow:hidden;
  }
  .usp-item{padding:34px 28px; border-right:1px solid var(--line); transition:background .2s ease;}
  .usp-item:last-child{border-right:none;}
  .usp-item:hover{background:var(--offwhite);}
  .usp-item b{display:block; font-family:'Poppins',sans-serif; font-size:32px; font-weight:700; margin-bottom:4px;}
  .usp-item span{font-size:14px; color:var(--ink-soft); font-weight:600;}

  /* ---------- SECTION GENERIC ---------- */
  .section{padding:110px 0;}
  .section.tight{padding:70px 0;}
  .offwhite{background:var(--offwhite);}
  .section-head{max-width:100%; margin-bottom:52px;}
  .section-head h2{font-size:clamp(34px,4.6vw,52px); margin-top:14px; margin-bottom:16px;}
  .section-head p{color:var(--ink-soft); font-size:17.5px; max-width:95ch;}

  /* ---------- ABOUT ---------- */
  .about-grid{display:grid; grid-template-columns:1fr 1fr; gap:70px; align-items:center;}
  .about-grid img{border-radius:12px; width:100%; height:460px; object-fit:cover; box-shadow:var(--shadow-sm);}
  .about-copy p{color:var(--ink-soft); font-size:17.5px; margin-bottom:18px; max-width:none;}
  .about-copy h2{font-size:clamp(30px,3.6vw,42px); margin-bottom:22px;}
  .stat-row{display:flex; gap:40px; margin-top:32px; padding-top:28px; border-top:1px solid var(--line);}
  .stat-row div b{display:block; font-family:'Poppins',sans-serif; font-size:28px;}
  .stat-row div span{font-size:13.5px; color:var(--ink-soft); font-weight:600;}

  /* ---------- FEATURES PANEL ---------- */
  .panel{background:var(--panel); border-radius:16px; box-shadow:var(--shadow-sm); padding:8px 40px;}
  .ledger-row{display:grid; grid-template-columns:52px 1fr 1.6fr; gap:26px; align-items:center; padding:30px 4px; border-bottom:1px solid var(--line);}
  .ledger-row:last-child{border-bottom:none;}
  .ledger-icon{width:52px; height:52px; border-radius:50%; background:var(--offwhite); display:flex; align-items:center; justify-content:center; flex-shrink:0;}
  .ledger-icon svg{width:24px; height:24px;}
  .ledger-row h3{font-size:20px; font-weight:600;}
  .ledger-row p{color:var(--ink-soft); font-size:16px;}

  /* ---------- MASTER PLAN ---------- */
  .plan-frame{border-radius:14px; overflow:hidden; position:relative; box-shadow:var(--shadow); cursor:pointer;}
  .plan-frame .img-wrap{overflow:hidden; border-radius:14px;}
  .plan-frame img{width:100%; height:auto; display:block; aspect-ratio:16/10; object-fit:cover; object-position:center 30%; transition:transform .5s ease;}
  .plan-frame:hover img{transform:scale(1.04);}
  .plan-caption{display:flex; justify-content:space-between; align-items:center; padding:22px 6px 0; font-size:14.5px; color:var(--ink-soft); flex-wrap:wrap; gap:12px; font-weight:600;}

  /* ---------- GALLERY ---------- */
  .gallery-grid{display:grid; grid-template-columns:1.4fr 1fr; grid-auto-rows:220px; gap:20px;}
  .gallery-grid .big{grid-row:span 2;}
  .gallery-grid .tile{border-radius:12px; overflow:hidden; box-shadow:var(--shadow-sm); position:relative; height:100%;}
  .gallery-grid img{width:100%; height:100%; object-fit:cover; display:block; transition:transform .5s ease;}
  .gallery-grid .tile:hover img{transform:scale(1.06);}
  .amenity-tags{display:flex; flex-wrap:wrap; gap:12px; margin-top:36px;}
  .amenity-tags span{border:1.5px solid var(--line); padding:11px 20px; border-radius:30px; font-size:14.5px; font-weight:700; color:var(--ink); background:var(--white); transition:all .18s ease;}
  .amenity-tags span:hover{border-color:var(--orange); color:var(--orange-deep);}

  /* ---------- AMENITIES GRID ---------- */
  .amen-grid{display:grid; grid-template-columns:repeat(4,1fr); gap:22px;}
  .amen-item{background:var(--white); border:1px solid var(--line); border-radius:14px; padding:30px 18px; text-align:center; transition:box-shadow .18s ease, transform .18s ease, border-color .18s ease;}
  .amen-item:hover{box-shadow:var(--shadow-sm); transform:translateY(-3px); border-color:var(--orange);}
  .amen-icon{width:60px; height:60px; border-radius:50%; background:var(--offwhite); display:flex; align-items:center; justify-content:center; margin:0 auto 18px;}
  .amen-icon svg{width:28px; height:28px; flex-shrink:0;}
  .amen-item span, .amen-item h3{font-size:18px; font-weight:700; color:var(--ink); line-height:1.3; display:block;}

  /* ---------- PLOT SIZES ---------- */
  .plot-size-layout{display:grid; grid-template-columns:1fr 1.05fr; gap:60px; align-items:center;}
  .plot-size-image{border-radius:14px; overflow:hidden; box-shadow:var(--shadow); height:100%; position:relative; cursor:zoom-in;}
  .plot-size-image-zoom-hint{position:absolute; left:50%; bottom:16px; transform:translateX(-50%); display:flex; align-items:center; gap:8px; background:rgba(20,16,10,0.72); backdrop-filter:blur(4px); color:var(--white); font-size:13px; font-weight:700; padding:9px 16px; border-radius:30px; pointer-events:none; opacity:0; transition:opacity .2s ease;}
  .plot-size-image:hover .plot-size-image-zoom-hint, .plot-size-image:focus .plot-size-image-zoom-hint{opacity:1;}
  .plot-size-image-zoom-hint svg{width:16px; height:16px; flex-shrink:0;}
  .plot-size-image img{width:100%; height:100%; min-height:420px; object-fit:cover; display:block;}
  .plot-size-list{display:flex; flex-direction:column;}
  .plot-size-row{display:flex; align-items:center; gap:18px; padding:22px 4px; border-bottom:1px solid var(--line);}
  .plot-size-row:first-child{padding-top:0;}
  .plot-size-swatch{width:16px; height:16px; border-radius:4px; flex-shrink:0;}
  .plot-size-info{flex:1;}
  .plot-size-name{font-family:'Poppins',sans-serif; font-size:22px; font-weight:700; color:var(--ink);}
  .plot-size-name span{font-size:14px; font-weight:600; color:var(--ink-soft); margin-left:4px;}
  .plot-size-dim{font-size:13.5px; color:var(--ink-soft); margin-top:3px;}
  .plot-size-count{font-size:13px; font-weight:800; color:var(--orange-deep); background:var(--offwhite); padding:7px 14px; border-radius:20px; white-space:nowrap;}
  .plot-size-total-row{display:flex; justify-content:space-between; align-items:center; padding:22px 4px 0; margin-top:4px;}
  .plot-size-total-row span{font-size:13.5px; font-weight:800; color:var(--ink-soft); text-transform:uppercase; letter-spacing:0.05em;}
  .plot-size-total-row b{font-family:'Poppins',sans-serif; font-size:24px; font-weight:700; color:var(--peacock);}

  /* ---------- PLOT SIZE IMAGE LIGHTBOX ---------- */
  .plotimg-modal{position:fixed; inset:0; background:rgba(10,8,6,0.94); z-index:300; display:none; align-items:center; justify-content:center; padding:24px; overflow:auto;}
  .plotimg-modal.active{display:flex;}
  .plotimg-modal img{max-width:100%; max-height:90vh; width:auto; height:auto; border-radius:8px; box-shadow:0 30px 80px rgba(0,0,0,0.5); cursor:default; display:block; margin:auto;}
  .plotimg-modal-close{position:fixed; top:20px; right:24px; background:rgba(255,255,255,0.12); border:1px solid rgba(255,255,255,0.3); color:var(--white); width:44px; height:44px; border-radius:50%; font-size:24px; line-height:1; cursor:pointer; display:flex; align-items:center; justify-content:center; z-index:2;}
  .plotimg-modal-close:hover{background:rgba(255,255,255,0.22);}

  /* ---------- PRICING ---------- */
  .price-panel{background:var(--offwhite); border-radius:20px; padding:44px; box-shadow:var(--shadow-sm);}
  .rate-cards{display:grid; grid-template-columns:1fr 1fr; gap:24px; margin-bottom:44px;}
  .rate-card{position:relative; border:1.5px solid var(--line); padding:38px 34px 30px; border-radius:14px; background:var(--white); transition:transform .2s ease, box-shadow .2s ease; overflow:hidden;}
  .rate-card:hover{transform:translateY(-4px); box-shadow:var(--shadow);}
  .rate-card.launch{background:var(--white);}
  .save-badge{position:absolute; top:0; right:0; background:var(--orange-a11y); color:var(--white); font-size:12px; font-weight:800; letter-spacing:0.02em; padding:8px 16px; border-bottom-left-radius:12px;}
  .rate-icon{width:46px; height:46px; border-radius:50%; background:var(--offwhite); display:flex; align-items:center; justify-content:center; margin-bottom:18px;}
  .rate-icon svg{width:22px; height:22px;}
  .rate-card .label{font-size:13.5px; font-weight:800; letter-spacing:0.05em; color:var(--orange-deep); text-transform:uppercase; margin-bottom:14px;}
  .rate-card .price{font-family:'Poppins',sans-serif; font-size:46px; font-weight:700; margin-bottom:6px;}
  .rate-card .unit{font-size:14.5px; color:var(--ink-soft); margin-bottom:16px;}
  .total-line{font-size:14px; font-weight:700; color:var(--peacock); border-top:1px dashed var(--line); padding-top:14px;}

  .payment-bar{display:flex; height:96px; border-radius:12px; overflow:hidden; box-shadow:var(--shadow-sm);}
  .pb-seg{display:flex; flex-direction:column; align-items:center; justify-content:center; color:var(--white); font-weight:800; font-size:19px; gap:4px; transition:flex .3s ease;}
  .pb-seg svg{width:20px; height:20px; margin-bottom:2px;}
  .pb-seg:nth-child(1){background:var(--peacock); flex:33;}
  .pb-seg:nth-child(2){background:var(--blue); flex:33;}
  .pb-seg:nth-child(3){background:var(--orange-a11y); flex:34;}
  .pb-seg span{font-size:12px; font-weight:600; margin-top:0;}
  .payment-caption{display:flex; justify-content:space-between; font-size:14.5px; color:var(--ink-soft); margin-top:16px; font-weight:600;}

  /* ---------- LOCATION PATH ---------- */
  .stop-grid{display:grid; grid-template-columns:repeat(5,1fr); gap:18px;}
  .stop-card{background:var(--white); border-radius:14px; padding:26px 20px; box-shadow:var(--shadow-sm); text-align:center; transition:transform .2s ease, box-shadow .2s ease;}
  .stop-card:hover{transform:translateY(-5px); box-shadow:var(--shadow);}
  .stop-icon{width:52px; height:52px; border-radius:50%; display:flex; align-items:center; justify-content:center; margin:0 auto 16px;}
  .stop-icon svg{width:24px; height:24px;}
  .stop-card h3{font-size:15.5px; font-weight:700; font-family:'Inter',sans-serif; margin-bottom:8px; line-height:1.3;}
  .stop-seo{font-size:12.5px; color:var(--ink-soft); margin-top:8px; line-height:1.4;}
  .location-seo-note{font-size:15px; color:var(--ink-soft); max-width:100%; margin:28px 0 0; line-height:1.7;}
  .location-seo-note strong{color:var(--ink); font-weight:700;}
  .stop-time{display:inline-block; font-size:12.5px; font-weight:800; color:var(--orange-deep); background:var(--offwhite); padding:5px 12px; border-radius:20px;}

  /* ---------- MAP ---------- */
  .map-frame{border-radius:14px; overflow:hidden; box-shadow:var(--shadow); border:1px solid var(--line); height:420px;}
  .map-frame iframe{width:100%; height:100%; border:0; display:block;}

  /* ---------- BLOG ---------- */
  .blog-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:28px;}
  .blog-card{border-radius:14px; overflow:hidden; background:var(--white); box-shadow:var(--shadow-sm); transition:transform .22s ease, box-shadow .22s ease;}
  .blog-card:hover{transform:translateY(-6px); box-shadow:var(--shadow);}
  .blog-card .thumb{height:200px; overflow:hidden;}
  .blog-card .thumb img{width:100%; height:100%; object-fit:cover; transition:transform .5s ease;}
  .blog-card:hover .thumb img{transform:scale(1.08);}
  .blog-card .body{padding:26px 24px 30px;}
  .blog-tag{font-size:12px; font-weight:800; color:var(--orange-deep); text-transform:uppercase; letter-spacing:0.05em;}
  .blog-card h3{font-size:20px; margin:10px 0 10px; line-height:1.3;}
  .blog-card p{font-size:15px; color:var(--ink-soft);}
  .blog-read{display:inline-block; margin-top:16px; font-size:14.5px; font-weight:700; color:var(--ink); border-bottom:2px solid var(--orange);}

  /* ---------- FAQ ---------- */
  .faq-list{max-width:100%; margin:0 auto;}
  .faq-item{border-bottom:1px solid var(--line); padding:26px 4px;}
  .faq-q{display:flex; justify-content:space-between; align-items:center; cursor:pointer; font-family:'Poppins',sans-serif; font-size:19px; font-weight:600; gap:20px;}
  .faq-q .plus{width:28px; height:28px; border-radius:50%; border:1.5px solid var(--ink); flex-shrink:0; position:relative; transition:transform .25s ease;}
  .faq-q .plus:before, .faq-q .plus:after{content:""; position:absolute; background:var(--ink); top:50%; left:50%; transform:translate(-50%,-50%);}
  .faq-q .plus:before{width:12px; height:1.5px;}
  .faq-q .plus:after{width:1.5px; height:12px; transition:opacity .2s ease;}
  .faq-item.open .plus{transform:rotate(180deg); border-color:var(--orange);}
  .faq-item.open .plus:after{opacity:0;}
  .faq-a{max-height:0; overflow:hidden; transition:max-height .3s ease;}
  .faq-item.open .faq-a{max-height:300px;}
  .faq-a p{padding-top:16px; color:var(--ink-soft); font-size:16px; max-width:100ch;}

  /* ---------- RERA BANNER ---------- */
  .rera-banner{border-radius:14px; border-left:6px solid var(--orange); padding:40px 44px; display:flex; align-items:center; justify-content:space-between; gap:28px; flex-wrap:wrap; background:var(--offwhite); box-shadow:var(--shadow-sm);}
  .rera-banner h3{font-size:23px; max-width:none; font-weight:600;}
  .rera-banner p{font-size:15.5px; color:var(--ink-soft); margin-top:8px;}

  /* ---------- CONTACT ---------- */
  .contact-grid{display:grid; grid-template-columns:0.85fr 1.15fr; gap:70px;}
  .contact-info p{color:var(--ink-soft); margin:16px 0 30px; max-width:42ch; font-size:17px;}
  .contact-line{display:flex; gap:14px; align-items:center; margin-bottom:16px; font-size:17px;}
  .contact-line b{font-weight:700;}
  .contact-icon{width:22px; text-align:center;}
  .form-panel{background:var(--offwhite); border-radius:16px; padding:40px; box-shadow:var(--shadow-sm);}
  .field{margin-bottom:20px;}
  .field label{display:block; font-size:13.5px; font-weight:700; color:var(--ink-soft); margin-bottom:8px;}
  .field input, .field select{width:100%; padding:14px 16px; border:1.5px solid var(--line); background:var(--white); font-family:'Inter',sans-serif; font-size:16px; border-radius:8px;}
  .field input:focus, .field select:focus{outline:none; border-color:var(--orange);}
  .form-panel .btn-primary{width:100%; text-align:center; border:none; margin-top:8px;}
  .form-panel .btn-primary:disabled, .flip-back .btn-primary:disabled{opacity:0.6; cursor:not-allowed;}
  .form-msg{min-height:20px; margin-top:12px; font-size:14px; font-weight:600;}
  .form-msg.success{color:#1a7f37;}
  .form-msg.error{color:#c0392b;}

  /* ---------- BROCHURE MODAL ---------- */
  .modal-overlay{position:fixed; inset:0; background:rgba(20,16,10,0.6); display:none; align-items:center; justify-content:center; z-index:200; padding:20px;}
  .modal-overlay.active{display:flex;}
  .flip-card{width:100%; max-width:440px; height:520px; perspective:1400px;}
  .flip-inner{position:relative; width:100%; height:100%; transition:transform .6s cubic-bezier(.4,.2,.2,1); transform-style:preserve-3d;}
  .flip-card.flipped .flip-inner{transform:rotateY(180deg);}
  .flip-face{position:absolute; inset:0; backface-visibility:hidden; border-radius:16px; overflow:hidden; box-shadow:0 30px 70px rgba(0,0,0,0.35); background:var(--white);}
  .flip-front{background:linear-gradient(160deg, var(--ink) 0%, #2b2620 100%); color:var(--white); display:flex; flex-direction:column; justify-content:flex-end; padding:36px;}
  .flip-front .modal-eyebrow{font-size:13px; font-weight:800; letter-spacing:0.08em; text-transform:uppercase; color:#F0D9A8; margin-bottom:14px;}
  .flip-front h3{font-size:28px; color:var(--white); margin-bottom:14px;}
  .flip-front p{font-size:15px; color:rgba(255,255,255,0.8); margin-bottom:26px;}
  .flip-back{transform:rotateY(180deg); padding:36px; display:flex; flex-direction:column;}
  .flip-back h3{font-size:22px; margin-bottom:6px;}
  .flip-back .sub{font-size:14px; color:var(--ink-soft); margin-bottom:22px;}
  .modal-close{position:absolute; top:16px; right:18px; background:rgba(255,255,255,0.15); border:none; color:var(--white); width:34px; height:34px; border-radius:50%; font-size:18px; cursor:pointer; z-index:5;}
  .flip-back .modal-close{background:var(--offwhite); color:var(--ink);}

  /* ---------- SMART POPUP ---------- */
  .smart-popup-card{position:relative; width:100%; max-width:440px; background:var(--white); border-radius:16px; padding:38px; box-shadow:0 30px 70px rgba(0,0,0,0.35);}
  .smart-popup-card .modal-close{background:var(--offwhite); color:var(--ink);}
  .smart-popup-badge{display:inline-block; font-size:12.5px; font-weight:800; letter-spacing:0.06em; text-transform:uppercase; color:var(--orange-deep); background:rgba(233,110,27,0.1); padding:6px 14px; border-radius:30px; margin-bottom:16px;}
  .smart-popup-card h3{font-size:22px; margin-bottom:10px; line-height:1.25;}
  .smart-popup-card p{font-size:14.5px; color:var(--ink-soft); margin-bottom:24px; line-height:1.6;}
  .smart-popup-card .btn-primary{width:100%; text-align:center; border:none; margin-top:4px;}
  .smart-popup-skip{text-align:center; margin-top:16px;}
  .smart-popup-skip a{font-size:13.5px; color:var(--ink-soft); text-decoration:underline;}
  .smart-popup-skip-btn{font-size:13.5px; color:var(--ink-soft); text-decoration:underline; background:none; border:none; padding:0; font-family:'Inter', sans-serif; cursor:pointer;}

  /* ---------- FOOTER ---------- */
  footer{background:#161310; color:rgba(255,255,255,0.75); padding:76px 0 0;}
  .footer-top{display:grid; grid-template-columns:1.3fr 1fr 1fr 1.1fr; gap:50px; padding-bottom:56px; border-bottom:1px solid rgba(255,255,255,0.12);}
  .footer-logo{background:var(--white); display:inline-flex; align-items:center; padding:14px 22px; border-radius:12px; margin-bottom:20px; box-shadow:0 6px 18px rgba(0,0,0,0.35);}
  .footer-logo img{height:46px; width:auto; display:block;}
  .footer-logo img{height:44px; width:auto; display:block;}
  .footer-about p{font-size:15px; line-height:1.7; color:rgba(255,255,255,0.6); max-width:34ch;}
  .footer-col .footer-heading{font-size:13px; color:#F0D9A8; letter-spacing:0.05em; margin-bottom:20px; text-transform:uppercase; font-weight:800;}
  .footer-col a, .footer-col p{display:block; font-size:15px; margin-bottom:13px; color:rgba(255,255,255,0.68);}
  .footer-link-btn{display:block; font-size:15px; margin-bottom:13px; color:rgba(255,255,255,0.68); background:none; border:none; padding:0; font-family:'Inter', sans-serif; text-align:left; cursor:pointer;}
  .footer-social{display:flex; gap:12px; margin-top:6px;}
  .footer-social a{width:38px; height:38px; border-radius:50%; border:1px solid rgba(255,255,255,0.25); display:flex; align-items:center; justify-content:center; font-size:14px; transition:all .2s ease;}
  .footer-social a:hover{background:var(--orange); border-color:var(--orange);}
  .footer-social svg{width:18px; height:18px; flex-shrink:0;}
  .footer-bottom{display:flex; justify-content:space-between; padding:26px 0; font-size:13.5px; color:rgba(255,255,255,0.45); flex-wrap:wrap; gap:10px;}

  /* ---------- RESPONSIVE ---------- */
  @media (max-width:960px){
    .usp-card{grid-template-columns:repeat(2,1fr);}
    .usp-item{border-bottom:1px solid var(--line);}
    .footer-top{grid-template-columns:1fr 1fr;}
    .amen-grid{grid-template-columns:repeat(3,1fr);}
    .plot-size-layout{gap:40px;}
  }
  @media (max-width:860px){
    .nav-links{display:none;}
    .nav-cta-small{display:none;}
    .nav-toggle{display:block;}
    .hero{height:auto; min-height:0;}
    .hero .img-crop{height:72vh; min-height:540px; max-height:620px; position:relative;}
    .hero img{height:100%;}
    .hero-content{top:16px; padding-bottom:56px;}
    .hero-tag{margin-bottom:12px;}
    .hero h1{font-size:clamp(28px,6.6vw,40px); margin-bottom:10px;}
    .hero p.lede{font-size:16px; margin-bottom:16px;}
    .hero-actions{gap:12px;}
    .hero-actions .btn-primary, .hero-actions .btn-outline{padding:13px 22px; font-size:14.5px;}
    .usp-band{margin-top:-30px;}
    .usp-card{grid-template-columns:1fr; border-radius:12px;}
    .usp-item{border-right:none;}
    .section{padding:64px 0;}
    .section-head{max-width:100%;}
    .about-grid{grid-template-columns:1fr;}
    .about-grid img{height:280px;}
    .panel{padding:6px 22px;}
    .ledger-row{grid-template-columns:44px 1fr; column-gap:16px; row-gap:6px;}
    .ledger-row .ledger-icon{grid-row:1/3; width:40px; height:40px;}
    .ledger-row .ledger-icon svg{width:18px; height:18px;}
    .ledger-row h3{grid-column:2; grid-row:1;}
    .ledger-row p{grid-column:2; grid-row:2;}
    .rate-cards{grid-template-columns:1fr;}
    .gallery-grid{grid-template-columns:1fr;}
    .gallery-grid{grid-auto-rows:260px;}
    .stop-grid{grid-template-columns:repeat(2,1fr);}
    .price-panel{padding:26px;}
    .gallery-grid .big{grid-row:auto;}
    .blog-grid{grid-template-columns:1fr;}
    .contact-grid{grid-template-columns:1fr;}
    .rera-banner{flex-direction:column; align-items:flex-start;}
    .footer-top{grid-template-columns:1fr; gap:36px;}
    .flip-card{height:min(560px, 88vh);}
    .flip-face{overflow-y:auto;}
    .amen-grid{grid-template-columns:1fr 1fr;}
    .plot-size-layout{grid-template-columns:1fr;}
    .plot-size-image img{min-height:280px; height:280px;}
  }
  @media (max-width:480px){
    .hero .img-crop{height:66vh; min-height:500px; max-height:600px;}
    .hero-content{top:14px; padding-bottom:48px;}
    .hero-tag{margin-bottom:10px; font-size:12px; padding:7px 16px 7px 12px;}
    .hero h1{font-size:clamp(24px,7vw,32px); margin-bottom:8px;}
    .hero p.lede{font-size:15px; margin-bottom:14px;}
    .hero-actions{gap:10px;}
    .hero-actions .btn-primary, .hero-actions .btn-outline{padding:12px 20px; font-size:14px;}
    .usp-band{margin-top:-24px;}
    .plot-size-image-zoom-hint{opacity:1;}
    .plotimg-modal{padding:12px;}
    .plotimg-modal-close{top:12px; right:12px; width:40px; height:40px; font-size:20px;}
  }

/* ==========================================================================
   BLOG / EEAT COMPONENTS — extends style.css, same design tokens.
   When approved, this file's contents get merged straight into style.css.
   ========================================================================== */

/* ---------- Breadcrumbs ---------- */
.breadcrumbs{padding:22px 0 0;}
.breadcrumbs ol{display:flex; flex-wrap:wrap; align-items:center; list-style:none; font-size:13.5px; color:var(--ink-soft);}
.breadcrumbs li{display:flex; align-items:center;}
.breadcrumbs li:not(:last-child):after{content:"/"; color:var(--line); margin:0 10px;}
.breadcrumbs a{color:var(--ink-soft); font-weight:600;}
.breadcrumbs a:hover{color:var(--orange-deep);}
.breadcrumbs span[aria-current]{color:var(--ink); font-weight:700;}

/* ---------- Blog listing head ---------- */
.blog-hero{padding:30px 0 6px;}
.blog-hero h1{font-size:clamp(32px,4vw,46px); margin:10px 0 14px;}
.blog-hero p{font-size:17px; color:var(--ink-soft); max-width:60ch;}

.trust-strip{display:flex; align-items:flex-start; gap:14px; background:var(--offwhite); border:1px solid var(--line); border-radius:12px; padding:18px 22px; margin-top:28px; font-size:14.5px; color:var(--ink-soft); line-height:1.6;}
.trust-strip svg{flex-shrink:0; margin-top:2px;}
.trust-strip b{color:var(--ink);}

/* ---------- Featured post (top of blog listing) ---------- */
.featured-post{display:grid; grid-template-columns:1.1fr 1fr; gap:40px; align-items:center; background:var(--offwhite); border-radius:20px; padding:20px; margin:36px 0 44px;}
.featured-post .thumb{border-radius:14px; overflow:hidden; height:340px;}
.featured-post .thumb img{width:100%; height:100%; object-fit:cover;}
.featured-post .body{padding:10px 26px 10px 4px;}
.featured-post .blog-tag{margin-bottom:14px; display:block;}
.featured-post h2{font-size:30px; margin-bottom:14px; line-height:1.18;}
.featured-post p.excerpt{font-size:16px; color:var(--ink-soft); margin-bottom:20px; line-height:1.7;}

/* ---------- Byline (cards + listing) ---------- */
.byline{display:flex; align-items:center; gap:10px; font-size:13.5px; color:var(--ink-soft);}
.byline img{width:28px; height:28px; border-radius:50%; object-fit:cover; flex-shrink:0;}
.byline .name{font-weight:700; color:var(--ink);}
.byline .sep{color:var(--line);}
.blog-card .byline{margin-top:16px; padding-top:16px; border-top:1px solid var(--line);}
.featured-post .byline{margin-top:6px;}

/* ---------- Post meta row (single post header) ---------- */
.post-meta-row{display:flex; align-items:center; justify-content:center; flex-wrap:wrap; gap:12px 20px; margin:26px 0 6px;}
.author-chip{display:flex; align-items:center; gap:11px;}
.author-chip img{width:44px; height:44px; border-radius:50%; object-fit:cover; box-shadow:0 0 0 1px var(--line);}
.author-chip .who{line-height:1.35;}
.author-chip .who a{font-weight:800; font-size:15px; color:var(--ink);}
.author-chip .who .role{display:block; font-size:12.5px; color:var(--ink-soft);}
.meta-facts{display:flex; align-items:center; gap:10px; font-size:14px; color:var(--ink-soft); flex-wrap:wrap;}
.meta-facts .dot{width:3px; height:3px; border-radius:50%; background:var(--ink-soft);}

/* ---------- Table of contents ---------- */
.toc{background:var(--offwhite); border:1px solid var(--line); border-radius:14px; padding:26px 28px; max-width:960px; margin:40px auto;}
.toc h2{font-size:13.5px; text-transform:uppercase; letter-spacing:0.07em; margin-bottom:16px; font-family:'Inter',sans-serif; font-weight:800; color:var(--ink);}
.toc ol{list-style:none; counter-reset:toc; display:flex; flex-direction:column; gap:10px;}
.toc li{counter-increment:toc; font-size:15px;}
.toc li a{color:var(--ink-soft); font-weight:600;}
.toc li a:before{content:counter(toc) ". "; color:var(--orange-deep); font-weight:800;}
.toc li a:hover{color:var(--orange-deep);}

/* ---------- Key takeaway callout ---------- */
.key-takeaway{background:linear-gradient(135deg,rgba(15,99,87,0.07),rgba(15,99,87,0.02)); border-left:4px solid var(--peacock); border-radius:4px 12px 12px 4px; padding:22px 26px; margin:34px 0;}
.key-takeaway .label{font-size:12px; font-weight:800; text-transform:uppercase; letter-spacing:0.07em; color:var(--peacock); margin-bottom:8px;}
.key-takeaway p{margin:0; font-size:16.5px; color:var(--ink);}

/* ---------- Article body typography ---------- */
.article-body{max-width:960px; margin:0 auto; font-size:18px; line-height:1.85; color:var(--ink);}
.article-body h2{font-size:27px; margin:46px 0 16px;}
.article-body h3{font-size:21px; margin:34px 0 12px;}
.article-body p{margin-bottom:22px;}
.article-body figure{margin:32px 0;}
.article-body figure img{border-radius:12px; width:100%; height:340px; object-fit:cover;}
.article-body figcaption{font-size:13.5px; color:var(--ink-soft); margin-top:10px; text-align:center;}
.article-body ul, .article-body ol{margin:0 0 22px 22px;}
.article-body li{margin-bottom:10px;}
.article-body a{color:var(--orange-deep); font-weight:700; text-decoration:underline; text-underline-offset:3px;}
.article-body blockquote{border-left:4px solid var(--orange); padding:4px 0 4px 22px; margin:32px 0; font-style:italic; color:var(--ink-soft); font-size:19px;}

/* ---------- Tags ---------- */
.tag-list{display:flex; flex-wrap:wrap; gap:10px; max-width:960px; margin:38px auto 0;}
.tag-list a{background:var(--offwhite); border:1px solid var(--line); padding:8px 16px; border-radius:30px; font-size:13.5px; font-weight:700; color:var(--ink-soft);}
.tag-list a:hover{border-color:var(--orange); color:var(--orange-deep);}

/* ---------- Author bio box ---------- */
.author-box{max-width:960px; margin:52px auto 0; background:var(--offwhite); border:1px solid var(--line); border-radius:18px; padding:34px; display:flex; gap:26px;}
.author-box img{width:92px; height:92px; border-radius:50%; object-fit:cover; flex-shrink:0; box-shadow:0 0 0 4px var(--white);}
.author-box .label{font-size:12px; font-weight:800; text-transform:uppercase; letter-spacing:0.07em; color:var(--orange-deep); margin-bottom:8px;}
.author-box h3{font-size:21px; margin-bottom:4px;}
.author-box .role{font-size:14.5px; font-weight:700; color:var(--ink-soft); margin-bottom:6px;}
.author-box .credentials{font-size:13.5px; color:var(--peacock); font-weight:700; margin-bottom:14px; display:flex; gap:8px; align-items:center; flex-wrap:wrap;}
.author-box p.bio{font-size:15.5px; color:var(--ink-soft); line-height:1.75; margin-bottom:18px;}
.author-box .author-links{display:flex; gap:20px; font-size:14px; font-weight:700; flex-wrap:wrap;}
.author-box .author-links a{color:var(--ink); border-bottom:2px solid var(--orange); padding-bottom:2px;}

/* ---------- Publisher trust note ---------- */
.publisher-note{max-width:960px; margin:22px auto 0; display:flex; gap:12px; align-items:flex-start; font-size:13.5px; color:var(--ink-soft); background:var(--white); border:1px dashed var(--line); border-radius:12px; padding:16px 20px; line-height:1.6;}
.publisher-note svg{flex-shrink:0; margin-top:2px;}
.publisher-note b{color:var(--ink);}

/* ---------- Related posts ---------- */
.related-heading{max-width:960px; margin:64px auto 0;}
.related-heading h2{font-size:26px;}
.related-grid{margin-top:26px;}

/* ---------- Pagination ---------- */
.blog-pagination{display:flex; justify-content:center; align-items:center; gap:10px; margin-top:54px;}
.blog-pagination a, .blog-pagination span{min-width:42px; height:42px; padding:0 14px; display:flex; align-items:center; justify-content:center; gap:6px; white-space:nowrap; border-radius:8px; font-weight:700; font-size:14.5px; border:1px solid var(--line); color:var(--ink-soft);}
.blog-pagination a:hover{border-color:var(--orange); color:var(--orange-deep);}
.blog-pagination .current{background:var(--ink); border-color:var(--ink); color:var(--white);}

@media (max-width:860px){
  .featured-post{grid-template-columns:1fr; padding:14px;}
  .featured-post .thumb{height:240px;}
  .featured-post .body{padding:22px 14px 14px;}
}
@media (max-width:640px){
  .author-box{flex-direction:column; text-align:center; padding:26px;}
  .author-box .credentials, .author-box .author-links{justify-content:center;}
  .post-meta-row{justify-content:flex-start; text-align:left;}
}

/* ==========================================================================
   PLOT PRICE PAGE — page-specific components, scoped classes only.
   Reuses .hero, .usp-band, .section, .about-grid, .plan-frame, .faq-item
   from above as-is. Nothing here overrides an existing selector — safe to
   append without affecting the homepage or any future page.
   ========================================================================== */

.breadcrumb-hero{font-size:13px; color:rgba(255,255,255,0.75); margin-bottom:18px; font-weight:600;}
.breadcrumb-hero a{font-weight:700; color:rgba(255,255,255,0.9);}

/* ---------- Price selector ---------- */
.price-shell{background:var(--white); border-radius:20px; box-shadow:var(--shadow); padding:8px; max-width:900px; margin:0 auto;}
.size-tabs{display:grid; grid-template-columns:repeat(4,1fr); gap:8px; padding:8px;}
.size-tab{background:var(--offwhite); border:1.5px solid transparent; border-radius:12px; padding:16px 8px; text-align:center; cursor:pointer; transition:all .2s ease;}
.size-tab b{display:block; font-family:'Poppins',sans-serif; font-size:20px;}
.size-tab span{font-size:12px; color:var(--ink-soft); font-weight:600;}
.size-tab.active{background:var(--white); border-color:var(--orange); box-shadow:var(--shadow-sm); transform:translateY(-2px);}
.size-tab.active b{color:var(--orange-deep);}

.price-display{padding:8px 32px 32px;}
.price-main{display:grid; grid-template-columns:1.1fr 1fr; gap:40px; align-items:center; padding:28px 0; border-bottom:1px solid var(--line);}
.price-main .lbl{font-size:12.5px; font-weight:800; letter-spacing:0.05em; text-transform:uppercase; color:var(--orange-deep); margin-bottom:10px;}
.price-main .amount{font-family:'Poppins',sans-serif; font-size:44px; font-weight:700; line-height:1;}
.price-main .amount span{font-size:16px; font-weight:600; color:var(--ink-soft); margin-left:6px;}
.price-main .compare{font-size:14.5px; color:var(--ink-soft); margin-top:8px;}
.price-main .compare del{color:#B4B0A6;}
.price-main .save-pill{display:inline-flex; align-items:center; gap:6px; background:rgba(15,99,87,0.1); color:var(--peacock); font-weight:700; font-size:13.5px; padding:8px 16px; border-radius:30px; margin-top:12px;}
.mini-tiles{display:grid; grid-template-columns:1fr 1fr; gap:12px;}
.mini-tile{background:var(--offwhite); border-radius:12px; padding:16px 18px;}
.mini-tile .t-lbl{font-size:11.5px; color:var(--ink-soft); font-weight:700; text-transform:uppercase; letter-spacing:0.04em;}
.mini-tile .t-val{font-family:'Poppins',sans-serif; font-size:19px; font-weight:700; margin-top:4px;}

.payment-breakdown{padding-top:24px;}
.payment-breakdown h3{font-size:16px; margin-bottom:16px;}
.pay-row{display:grid; grid-template-columns:repeat(3,1fr); gap:12px;}
.pay-chip{border-radius:12px; padding:18px 16px; color:var(--white); text-align:center; transition:transform .25s ease;}
.pay-chip:hover{transform:translateY(-4px); box-shadow:var(--shadow-sm);}
.pay-chip.p1{background:var(--peacock);}
.pay-chip.p2{background:var(--blue);}
.pay-chip.p3{background:var(--orange);}
.pay-chip .pct{font-family:'Poppins',sans-serif; font-size:22px; font-weight:700;}
.pay-chip .plabel{font-size:11.5px; opacity:0.85; margin-top:2px;}
.pay-chip .pamt{font-size:15px; font-weight:700; margin-top:8px;}

.charge-note{display:flex; gap:14px; align-items:flex-start; background:var(--offwhite); border-left:4px solid var(--gold); border-radius:4px 12px 12px 4px; padding:18px 22px; margin-top:28px; font-size:15px; color:var(--ink-soft);}
.charge-note svg{flex-shrink:0; margin-top:2px;}

/* ---------- Feature row ---------- */
.feature-row{display:grid; grid-template-columns:repeat(4,1fr); gap:20px; margin-top:36px;}
.feature-card{background:var(--white); border:1px solid var(--line); border-radius:14px; padding:26px 20px; text-align:center; transition:transform .2s ease, box-shadow .2s ease;}
.feature-card:hover{transform:translateY(-5px); box-shadow:var(--shadow-sm); border-color:transparent;}
.feature-icon{width:50px; height:50px; border-radius:50%; background:var(--offwhite); display:flex; align-items:center; justify-content:center; margin:0 auto 14px;}
.feature-icon svg{width:22px; height:22px;}
.feature-card h3{font-size:15px; margin-bottom:6px;}
.feature-card p{font-size:13.5px; color:var(--ink-soft);}

/* ---------- Internal link cards ---------- */
.link-grid{display:grid; grid-template-columns:repeat(4,1fr); gap:18px; margin-top:32px;}
.link-card{background:var(--white); border:1px solid var(--line); border-radius:14px; padding:24px 20px; display:block; transition:transform .2s ease, box-shadow .2s ease;}
.link-card:hover{transform:translateY(-4px); box-shadow:var(--shadow-sm); border-color:transparent;}
.link-card .li-icon{width:40px; height:40px; border-radius:10px; background:var(--offwhite); display:flex; align-items:center; justify-content:center; margin-bottom:14px;}
.link-card .li-icon svg{width:19px; height:19px;}
.link-card h3{font-size:15px; margin-bottom:6px;}
.link-card span{font-size:13px; color:var(--orange-deep); font-weight:700;}

@media (max-width:960px){
  .price-main{grid-template-columns:1fr;}
  .feature-row{grid-template-columns:repeat(2,1fr);}
  .link-grid{grid-template-columns:repeat(2,1fr);}
}
@media (max-width:720px){
  .size-tabs{grid-template-columns:repeat(2,1fr);}
  .pay-row{grid-template-columns:1fr;}
  .mini-tiles{grid-template-columns:1fr;}
  .feature-row{grid-template-columns:1fr;}
  .link-grid{grid-template-columns:1fr;}
  .price-display{padding:8px 18px 24px;}
}

/* ==========================================================================
   ABOUT US PAGE — page-specific components, scoped classes only.
   Reuses .hero, .about-grid, .panel/.ledger-row, .cta-band from above as-is.
   Nothing here overrides an existing selector.
   ========================================================================== */

.portfolio-grid{display:grid; gap:22px;}
.portfolio-grid.four-col{grid-template-columns:repeat(4,1fr);}
.portfolio-grid.three-col{grid-template-columns:repeat(3,1fr);}
.portfolio-grid.two-col{grid-template-columns:1fr 1fr;}
.portfolio-card{background:var(--white); border:1px solid var(--line); border-radius:16px; padding:28px 26px; transition:transform .2s ease, box-shadow .2s ease;}
.portfolio-card:hover{transform:translateY(-6px); box-shadow:var(--shadow);}
.portfolio-card.center{text-align:center;}
.portfolio-card.current{border-color:var(--orange); box-shadow:var(--shadow-sm);}
.portfolio-card .stat-num{font-size:32px; font-family:'Poppins',sans-serif; font-weight:700;}
.portfolio-badge{display:inline-block; font-size:11.5px; font-weight:800; letter-spacing:0.04em; text-transform:uppercase; padding:5px 12px; border-radius:20px; margin-bottom:16px;}
.portfolio-badge.prelaunch{background:rgba(233,110,27,0.12); color:var(--orange-deep);}
.portfolio-badge.construction{background:rgba(14,127,166,0.12); color:var(--blue);}
.portfolio-badge.comingsoon{background:rgba(173,131,49,0.12); color:var(--gold);}
.portfolio-card h3{font-size:19px; margin-bottom:6px;}
.portfolio-card .loc{font-size:13.5px; color:var(--ink-soft); font-weight:600; margin-bottom:14px;}
.portfolio-card p{font-size:14.5px; color:var(--ink-soft); line-height:1.6;}

@media (max-width:960px){
  .portfolio-grid.four-col{grid-template-columns:repeat(2,1fr);}
  .portfolio-grid.three-col{grid-template-columns:1fr;}
  .portfolio-grid.two-col{grid-template-columns:1fr;}
}
@media (max-width:600px){
  .portfolio-grid.four-col{grid-template-columns:1fr;}
}

/* ==========================================================================
   CONTACT US PAGE — page-specific components, scoped classes only.
   Reuses .hero, .contact-grid/.form-panel, .map-frame, .link-grid,
   .faq-item from above as-is. Nothing here overrides an existing selector.
   ========================================================================== */

.quick-contact-band{margin-top:-48px; position:relative; z-index:10;}
.quick-contact-card{background:var(--white); border-radius:14px; box-shadow:var(--shadow-lift); display:grid; grid-template-columns:repeat(3,1fr); overflow:hidden;}
.qc-item{padding:26px 24px; border-right:1px solid var(--line); display:flex; align-items:center; gap:14px; transition:background .2s ease;}
.qc-item:last-child{border-right:none;}
.qc-item:hover{background:var(--offwhite);}
.qc-item .qi-icon{width:44px; height:44px; border-radius:50%; background:var(--offwhite); display:flex; align-items:center; justify-content:center; flex-shrink:0;}
.qc-item .qi-icon svg{width:20px; height:20px;}
.qc-item b{display:block; font-family:'Poppins',sans-serif; font-size:17px; font-weight:700;}
.qc-item span{font-size:12.5px; color:var(--ink-soft); font-weight:600;}

.steps-row{display:grid; grid-template-columns:repeat(4,1fr); gap:20px; margin-top:36px;}
.step-card{background:var(--white); border:1px solid var(--line); border-radius:14px; padding:26px 22px;}
.step-num{width:34px; height:34px; border-radius:50%; background:var(--orange); color:var(--white); display:flex; align-items:center; justify-content:center; font-family:'Poppins',sans-serif; font-weight:700; font-size:15px; margin-bottom:16px;}
.step-card h3{font-size:16px; margin-bottom:8px;}
.step-card p{font-size:13.5px; color:var(--ink-soft); line-height:1.5;}

@media (max-width:960px){
  .steps-row{grid-template-columns:repeat(2,1fr);}
}
@media (max-width:720px){
  .quick-contact-card{grid-template-columns:1fr;}
  .qc-item{border-right:none; border-bottom:1px solid var(--line);}
  .qc-item:last-child{border-bottom:none;}
  .steps-row{grid-template-columns:1fr;}
}

/* ---------- Footer legal links ---------- */
.footer-legal-links{display:flex; gap:18px;}
.footer-legal-links a{color:rgba(255,255,255,0.55); font-weight:600; transition:color .18s ease;}
.footer-legal-links a:hover{color:var(--white);}

/* ==========================================================================
   GOKUL, MAHAVAN LOCATION PAGE — page-specific components, scoped classes.
   Reuses .hero, .usp-band, .section, .about-grid, .panel/.ledger-row,
   .map-frame, .link-grid, .faq-item from above as-is. Nothing here
   overrides an existing selector — safe to append without affecting the
   homepage or any other page.
   ========================================================================== */

.ledger-row .ledger-h2{font-size:19px; font-weight:600; color:var(--ink); font-family:'Poppins',sans-serif;}

/* ---------- Illustrated location cards ---------- */
.loc-grid{display:grid; grid-template-columns:repeat(4,1fr); gap:22px;}
.loc-card{background:var(--white); border-radius:16px; overflow:hidden; box-shadow:var(--shadow-sm); transition:transform .2s ease, box-shadow .2s ease;}
.loc-card:hover{transform:translateY(-6px); box-shadow:var(--shadow);}
.loc-illus{height:150px; position:relative; overflow:hidden;}
.loc-illus svg{width:100%; height:100%; display:block;}
.loc-illus img{width:100%; height:100%; object-fit:cover; display:block; transition:transform .5s ease;}
.loc-card:hover .loc-illus img{transform:scale(1.06);}
.loc-time-badge{position:absolute; top:12px; right:12px; background:rgba(255,255,255,0.92); backdrop-filter:blur(4px); font-size:11.5px; font-weight:800; color:var(--orange-deep); padding:5px 12px; border-radius:20px;}
.loc-body{padding:20px 20px 24px;}
.loc-body h3{font-size:16px; margin-bottom:8px; line-height:1.3;}
.loc-body p{font-size:13.5px; color:var(--ink-soft); margin-bottom:10px; line-height:1.5;}
.loc-benefit{font-size:12.5px; font-weight:700; color:var(--peacock); display:flex; align-items:center; gap:6px;}
.loc-benefit svg{width:14px; height:14px; flex-shrink:0;}

@media (max-width:960px){
  .loc-grid{grid-template-columns:repeat(2,1fr);}
}
@media (max-width:720px){
  .loc-grid{grid-template-columns:1fr;}
}