/* =========================================================
   NIKITA HEMNANI — PINK + PURPLE PREMIUM RESPONSIVE OVERRIDES
   Load this AFTER the existing styles.css
   ========================================================= */

:root{
  --ink:#24172d;
  --ink-2:#3d2a48;
  --purple:#6e3f79;
  --purple-deep:#4a2858;
  --purple-soft:#a37aab;
  --pink:#d98ea9;
  --pink-deep:#c66f90;
  --pink-soft:#f4d9e3;
  --blush:#fbf3f7;
  --lavender:#f3edf6;
  --cream:#fffafc;
  --white:#ffffff;
  --line:rgba(74,40,88,.14);
  --muted:#76677d;
  --shadow:0 24px 70px rgba(74,40,88,.12);
  --shadow-soft:0 12px 35px rgba(74,40,88,.09);
  --radius:28px;
  --radius-sm:18px;
  --container:1350px;
}

/* Global */
html{
  scroll-behavior:smooth;
  overflow-x:hidden;
}
body{
  overflow-x:hidden;
  background:var(--cream) !important;
  color:var(--ink) !important;
}
*,
*::before,
*::after{ box-sizing:border-box; }

img,
svg,
canvas,
video{
  max-width:100%;
}

.container{
  width:min(var(--container), calc(100% - 48px)) !important;
  margin-inline:auto !important;
}

.section{
  padding:clamp(72px, 8vw, 132px) 0 !important;
}

.label{
  color:var(--purple) !important;
  letter-spacing:.13em;
}

h1,h2,h3,h4,h5,h6{
  color:var(--ink) !important;
  text-wrap:balance;
}

p{
  color:var(--muted);
  text-wrap:pretty;
}

em{
  color:var(--pink-deep) !important;
  font-style:italic;
}

/* Header */
.site-header{
  background:rgba(255,250,252,.88) !important;
  border-bottom:1px solid var(--line) !important;
  backdrop-filter:blur(18px);
  -webkit-backdrop-filter:blur(18px);
}

.header-inner{
  min-height:82px;
  gap:24px;
}

.brand img{
  width:clamp(238px, 12vw, 250px);
  /*height:auto;*/
}

.nav{
  gap:clamp(16px, 2vw, 30px) !important;
}

.nav a{
  color:var(--ink-2) !important;
}
.nav a:hover{ color:var(--purple) !important; }

.pill-cta,
.btn.dark,
.help-btn{
  background:linear-gradient(135deg,var(--purple-deep),var(--purple)) !important;
  color:#fff !important;
  border-color:transparent !important;
  box-shadow:0 12px 30px rgba(74,40,88,.18);
}

.pill-cta:hover,
.btn.dark:hover,
.help-btn:hover{
  background:linear-gradient(135deg,var(--pink-deep),var(--purple)) !important;
  transform:translateY(-2px);
}

.btn.light{
  background:var(--white) !important;
  color:var(--purple-deep) !important;
  border-color:rgba(255,255,255,.65) !important;
}

.btn.outline{
  color:var(--purple-deep) !important;
  border-color:rgba(74,40,88,.3) !important;
  background:rgba(255,255,255,.45) !important;
}

.text-link,
.tiny-cta{ color:var(--purple-deep) !important; }

/* Hero */
.hero{
  min-height:clamp(650px, 88svh, 900px) !important;
  background:#eadce7;
}

.hero-image{
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center center;
}

.hero-shade{
  background:
    linear-gradient(90deg, rgba(32,16,39,.72) 0%, rgba(51,26,60,.47) 34%, rgba(51,26,60,.08) 64%, rgba(51,26,60,.02) 100%) !important;
}

.hero-copy{
  width:min(650px, 100%) !important;
}

.hero-copy .label,
.hero-copy h1,
.hero-copy p,
.hero-copy .text-link{
  color:#fff !important;
}

.hero-copy h1{
  font-size:clamp(3rem, 6.2vw, 6rem) !important;
  line-height:.96 !important;
}

.hero-copy h1 em{
  color:#f5b9cf !important;
}

.hero-copy p{
  max-width:590px;
  font-size:clamp(1rem,1.4vw,1.2rem);
}

.hero-note{
  background:rgba(255,250,252,.88) !important;
  border:1px solid rgba(255,255,255,.58) !important;
  box-shadow:var(--shadow) !important;
  backdrop-filter:blur(16px);
  border-radius:var(--radius-sm) !important;
}
.hero-note small,
.hero-note a{ color:var(--purple) !important; }

/* Sections */
.intro-section,
.patterns-section,
.faq-section{
  background:var(--cream) !important;
}

.warm-section,
.rebirth-detail{
  background:linear-gradient(145deg,var(--blush),var(--lavender)) !important;
}

.philosophy-section{
  background:var(--purple-deep) !important;
}
.philosophy-section h2,
.philosophy-section p,
.philosophy-section .label,
.philosophy-section .text-link{
  color:#fff !important;
}
.philosophy-section em{ color:#f3b2ca !important; }

.portrait-strip figure,
.feature-image,
.pattern-image,
.final-image{
  overflow:hidden;
  border-radius:var(--radius) !important;
  box-shadow:var(--shadow-soft);
}

.story-quote{
  border-color:var(--pink) !important;
}

.feature-card,
.pattern-card,
.mini-card,
.testimonial-card{
  background:rgba(255,255,255,.84) !important;
  border:1px solid var(--line) !important;
  box-shadow:var(--shadow-soft) !important;
  border-radius:var(--radius-sm) !important;
}

.pattern-card > span,
.mini-card > span,
.offer-number,
.quote-icon{
  color:var(--pink-deep) !important;
}

/* Offerings */
.offerings-section{
  background:#fff !important;
}

.offering{
  border-radius:clamp(20px,2.3vw,34px) !important;
  overflow:hidden;
  box-shadow:var(--shadow);
}

.offering-light{
  background:linear-gradient(145deg,#fff,var(--blush)) !important;
  color:var(--ink) !important;
  border:1px solid var(--line) !important;
}

.offering-dark{
  background:linear-gradient(145deg,var(--purple-deep),#774d7f) !important;
  color:#fff !important;
}
.offering-dark h3,
.offering-dark p,
.offering-dark strong,
.offering-dark .offer-kicker,
.offering-dark .offer-number{
  color:#fff !important;
}
.offering-dark .rebirth-points span{
  color:#fff !important;
  border-color:rgba(255,255,255,.22) !important;
  background:rgba(255,255,255,.08) !important;
}

/* Testimonials */
.testimonials-section{
  background:linear-gradient(180deg,#fff,var(--blush)) !important;
}

.testimonial-controls button{
  border-color:var(--line) !important;
  color:var(--purple-deep) !important;
  background:#fff !important;
}

.testimonial-progress{
  background:rgba(110,63,121,.12) !important;
}
.testimonial-progress span{
  background:linear-gradient(90deg,var(--pink),var(--purple)) !important;
}

/* FAQ */
.faq-item{
  border-color:var(--line) !important;
}
.faq-item button{
  color:var(--ink) !important;
}
.faq-item.open{
  /*background:var(--blush) !important;*/
  border-radius:16px;
}

/* Final CTA */
.final-section{
  background:linear-gradient(135deg,#f7dfe8 0%,#eadff0 50%,#d9c7e0 100%) !important;
}
.final-copy{
  min-width:0;
}

/* Footer/help */
.site-footer{
  background:var(--ink) !important;
  color:#fff !important;
}
.site-footer a,
.site-footer span{
  color:rgba(255,255,255,.78) !important;
}

.help-fixed{
  background:rgba(255,250,252,.94) !important;
  border-top:1px solid var(--line) !important;
  backdrop-filter:blur(18px);
  -webkit-backdrop-filter:blur(18px);
}

/* Prevent layout overflow */
.hero-inner,
.intro,
.split-feature,
.pattern-layout,
.philosophy-grid,
.offerings-grid,
.detail-wrap,
.detail-cards,
.testimonials-wrap,
.faq-grid,
.final-grid,
.footer-inner{
  min-width:0;
}

.pattern-card,
.offering,
.mini-card,
.testimonial-card,
.feature-card{
  min-width:0;
}

/* =========================
   Tablet
   ========================= */
@media (max-width:1100px){
  .container{
    width:min(100% - 40px, var(--container)) !important;
  }

  .nav{ display:none !important; }
  .menu-btn{ display:flex !important; }

  .hero{
    min-height:760px !important;
  }

  .hero-inner{
    align-items:flex-end !important;
    padding-bottom:72px !important;
  }

  .hero-copy{
    width:min(620px, 72%) !important;
  }

  .hero-note{
    right:20px !important;
    bottom:32px !important;
    max-width:300px;
  }

  .split-feature,
  .philosophy-grid,
  .detail-wrap,
  .faq-grid,
  .final-grid{
    gap:clamp(32px,5vw,64px) !important;
  }

  .offerings-grid{
    gap:24px !important;
  }

  .detail-cards{
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
  }

  .testimonial-card{
    flex:0 0 min(72vw, 520px) !important;
  }
}

/* =========================
   Mobile landscape / tablet portrait
   ========================= */
@media (max-width:820px){
  .container{
    width:calc(100% - 32px) !important;
  }

  .section{
    padding:72px 0 !important;
  }

  .header-inner{
    min-height:70px;
  }

  .pill-cta{ display:none !important; }

  .mobile-menu{
    background:rgba(255,250,252,.98) !important;
  }
  .mobile-menu a{
    color:var(--ink) !important;
  }

  .hero{
    min-height:780px !important;
  }

  .hero-image{
    object-position:62% center !important;
  }

  .hero-shade{
    background:
      linear-gradient(180deg, rgba(31,15,38,.08) 0%, rgba(31,15,38,.18) 30%, rgba(31,15,38,.84) 100%) !important;
  }

  .hero-inner{
    align-items:flex-end !important;
    padding-top:120px !important;
    padding-bottom:48px !important;
  }

  .hero-copy{
    width:100% !important;
    max-width:650px !important;
    padding-right:0 !important;
  }

  .hero-copy h1{
    font-size:clamp(2.9rem,11vw,5rem) !important;
  }

  .hero-note{
    display:none !important;
  }

  .portrait-strip{
    grid-template-columns:1fr 1fr !important;
    gap:12px !important;
  }
  .portrait-strip figure:nth-child(3){
    grid-column:1 / -1;
    max-height:420px;
  }

  .split-feature,
  .philosophy-grid,
  .detail-wrap,
  .faq-grid,
  .final-grid,
  .offerings-grid{
    grid-template-columns:1fr !important;
  }

  .pattern-layout{
    grid-template-columns:1fr 1fr !important;
    gap:16px !important;
  }

  .pattern-image{
    grid-column:1 / -1 !important;
    order:2;
    max-height:520px;
  }

  .pattern-card:nth-of-type(3),
  .pattern-card:nth-of-type(4){
    order:3;
  }

  .offerings-grid{
    align-items:stretch !important;
  }

  .offering{
    padding:clamp(24px,6vw,42px) !important;
  }

  .detail-cards{
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
  }

  .testimonials-head{
    align-items:flex-end !important;
    gap:24px !important;
  }

  .testimonial-card{
    flex:0 0 min(84vw, 500px) !important;
  }

  .final-image{
    max-height:620px;
  }

  .footer-inner{
    flex-wrap:wrap;
    gap:24px;
  }

  .help-fixed{
    position:fixed !important;
  }
  .help-message{
    display:none !important;
  }
  .help-inner{
    justify-content:flex-end !important;
  }
}

/* =========================
   Phones
   ========================= */
@media (max-width:560px){
  :root{
    --radius:20px;
    --radius-sm:16px;
  }

  .container{
    width:calc(100% - 24px) !important;
  }

  .section{
    padding:58px 0 !important;
  }

  h2{
    font-size:clamp(2rem,10vw,3.2rem) !important;
    line-height:1.02 !important;
  }

  h3{
    font-size:clamp(1.25rem,6vw,1.8rem) !important;
  }

  .label{
    font-size:11px !important;
    line-height:1.45;
  }

  .site-header{
    padding-inline:0 !important;
  }

  .brand img{
    width:280px !important;
  }

  .menu-btn{
    width:44px !important;
    height:44px !important;
  }

  .mobile-menu{
    padding:96px 20px 30px !important;
    gap:8px;
  }

  .mobile-menu a{
    font-size:clamp(1.4rem,7vw,2rem) !important;
  }

  .hero{
    min-height:100svh !important;
    max-height:none !important;
  }

  .hero-image{
    object-position:66% center !important;
  }

  .hero-inner{
    min-height:100svh !important;
    padding-top:120px !important;
    padding-bottom:52px !important;
  }

  .hero-copy h1{
    font-size:clamp(2.65rem,13vw,4rem) !important;
    line-height:.96 !important;
  }

  .hero-copy p{
    font-size:1rem !important;
    line-height:1.65 !important;
  }

  .actions{
    flex-direction:column !important;
    align-items:flex-start !important;
    gap:16px !important;
  }

  .btn,
  .pill-cta{
    min-height:48px;
    padding:13px 18px !important;
  }

  .portrait-strip{
    grid-template-columns:1fr !important;
  }
  .portrait-strip figure:nth-child(3){
    grid-column:auto;
  }

  .story-quote{
    padding-left:20px !important;
  }

  .split-feature{
    gap:28px !important;
  }

  .feature-card{
    padding:24px !important;
  }

  .pattern-layout{
    grid-template-columns:1fr !important;
  }

  .pattern-image{
    grid-column:auto !important;
    order:initial;
  }

  .pattern-card{
    padding:22px !important;
  }

  .detail-cards{
    grid-template-columns:1fr !important;
  }

  .mini-card{
    padding:22px !important;
  }

  .offerings-head{
    margin-bottom:28px !important;
  }

  .offering{
    padding:24px 20px !important;
  }

  .offering ul{
    padding-left:20px !important;
  }

  .rebirth-points{
    display:flex !important;
    flex-wrap:wrap !important;
    gap:8px !important;
  }

  .rebirth-points span{
    width:auto !important;
  }

  .testimonials-head{
    flex-direction:column !important;
    align-items:flex-start !important;
  }

  .testimonial-card{
    flex:0 0 88vw !important;
    padding:22px !important;
  }

  .testimonial-top{
    align-items:center !important;
  }

  .testimonial-top img{
    width:52px !important;
    height:52px !important;
  }

  .faq-item button{
    gap:16px;
    padding:20px 0 !important;
    font-size:1rem !important;
    text-align:left;
  }

  .final-grid{
    gap:28px !important;
  }

  .final-copy .actions .btn{
    width:100%;
    justify-content:center;
  }

  .footer-inner{
    flex-direction:column !important;
    align-items:flex-start !important;
  }

  .footer-links{
    flex-wrap:wrap !important;
    gap:12px 18px !important;
  }

  .help-fixed{
    left:auto !important;
    right:12px !important;
    bottom:12px !important;
    width:auto !important;
    border:0 !important;
    background:transparent !important;
    backdrop-filter:none !important;
  }

  .help-fixed .container{
    width:auto !important;
    margin:0 !important;
  }

  .help-btn{
    min-width:50px;
    min-height:50px;
    padding:12px 16px !important;
    border-radius:999px !important;
    box-shadow:0 12px 35px rgba(74,40,88,.28);
  }
}

/* Small phones */
@media (max-width:380px){
  .container{
    width:calc(100% - 20px) !important;
  }
  .hero-copy h1{
    font-size:2.45rem !important;
  }
  .btn{
    font-size:.92rem !important;
  }
}

/* Better accessibility / reduced motion */
@media (prefers-reduced-motion:reduce){
  html{ scroll-behavior:auto; }
  *,
  *::before,
  *::after{
    animation-duration:.01ms !important;
    animation-iteration-count:1 !important;
    transition-duration:.01ms !important;
  }
}


/* FINAL MOBILE GUTTER OVERRIDE */
@media (max-width:620px){
  .container{
    width:calc(100% - 56px) !important; /* 28px each side */
    max-width:none !important;
    margin-inline:auto !important;
  }
}
@media (max-width:390px){
  .container{
    width:calc(100% - 48px) !important; /* 24px each side */
  }
}