:root{
    --pink-900: var(--primary, #E06BAF);
    --pink-700: #E06BAF;
    --pink-200: var(--light, #ffd6e8);
    --pink-100: var(--dark, #ffe6f0);
    --ink-900:#1f1f1f; --ink-700:#333; --ink-600:#545; --white:#fff;
    --radius-xl:28px; --radius-lg:22px; --radius-md:18px;
    --shadow-md:0 8px 24px rgba(255,77,166,.18);
    --shadow-lg:0 16px 40px rgba(255,77,166,.22);
  }

  .about-hero{
    max-width: 1320px; margin: 20px auto 30px; padding: 60px 18px;
    background: linear-gradient(145deg, var(--pink-100), var(--pink-200));
    border-radius: var(--radius-xl); box-shadow: var(--shadow-md);
    display:grid; gap:22px; align-items:center;
    grid-template-columns: 1.2fr .8fr;
  }
  .about-hero h1{ margin:0; font-size:clamp(2rem, 2.2vw + 1rem, 3rem); color:var(--ink-900); }
  .about-hero p{ margin:8px 0 18px; color:var(--ink-600); max-width: 60ch; }
  .about-hero .cta { display:flex; gap:12px; flex-wrap:wrap; }
  .btn-pill{ border:none; border-radius:999px; padding:12px 18px; font-weight:700; cursor:pointer; }
  .btn-primary{ background:var(--pink-900); color:#fff; box-shadow:0 10px 22px rgba(214,51,132,.25); }
  .btn-primary:hover{ background:var(--pink-700); }
  .btn-ghost{ background:#fff; color:var(--pink-900); box-shadow:0 6px 16px rgba(0,0,0,.06); }

  .about-hero .image{
    background:#fff; border-radius: var(--radius-lg); padding:10px; box-shadow: var(--shadow-md);
  }
  .about-hero img{ width:100%; height:auto; display:block; border-radius: var(--radius-md); }

  @media (max-width: 992px){ .about-hero{ grid-template-columns:1fr; padding: 44px 16px; } }

  /* Story (Our Story) */
  .about-intro{
    max-width: 1320px;
    margin: 0 auto 26px;
    padding: 32px 26px 28px;
    background:#fffaf7;
    border-radius: var(--radius-xl);
    border:1px solid #f2e7ee;
    box-shadow: 0 16px 36px rgba(241,65,135,.12);
  }
  .about-intro.story-alt{
    display:grid;
    gap:22px;
  }
  .about-intro.story-alt .story-block{
    max-width: 860px;
    margin: 0 auto;
    padding: 0;
  }
  .story-title{
    margin:0;
    font-size:clamp(2rem, 1.6vw + 1.4rem, 3rem);
    color:var(--ink-900);
    font-weight:600;
  }
  .story-title em{
    font-style:italic;
    color:var(--pink-700);
  }
  .story-body{
    margin:0;
    color:var(--ink-600);
    line-height:1.75;
    font-size:1.05rem;
    max-width:100%;
  }
  .story-images{
    display:grid;
    grid-template-columns:repeat(2,1fr);
    gap:16px;
    margin: 6px auto 2px;
    max-width: 860px;
  }
  .story-images .img-card{
    background:#fff;
    padding:10px;
    border-radius:20px;
    box-shadow:0 18px 34px rgba(0,0,0,.08);
  }
  .story-images img{
    width:100%;
    height:300px;
    object-fit:cover;
    border-radius:16px;
    display:block;
  }
  @media (max-width: 992px){
    .story-images{ grid-template-columns:1fr 1fr; }
  }
  @media (max-width: 640px){
    .story-images{ grid-template-columns:1fr; }
    .story-images img{ height:320px; }
  }

  /* Features grid */
  .about-features{ max-width: 1320px; margin: 0 auto 24px; padding: 0 16px; }
  .features-grid{ display:grid; gap:16px; grid-template-columns: repeat(4, 1fr); }
  @media (max-width: 992px){ .features-grid{ grid-template-columns: repeat(2,1fr); } }
  @media (max-width: 576px){ .features-grid{ grid-template-columns: 1fr; } }
  .feature-card{
    background:#fff; border-radius: var(--radius-lg); padding: 18px;
    box-shadow: 0 6px 18px rgba(0,0,0,.05);
    transition: transform .2s, box-shadow .2s;
  }
  .feature-card:hover{ transform: translateY(-3px); box-shadow: var(--shadow-lg); }
  .feature-card h3{ color: var(--ink-700); margin: 8px 0 6px; }
  .feature-card p{ color: var(--ink-600); margin:0; }

  /* Stats strip */
  .about-stats{
    max-width: 1320px; margin: 0 auto 26px; padding: 18px 10px;
    background:#fff; border-radius: 999px; box-shadow: 0 8px 22px rgba(255,77,166,.14);
    display:grid; grid-template-columns: repeat(3, 1fr); gap: 10px; text-align:center;
  }
  @media (max-width: 768px){ .about-stats{ grid-template-columns: 1fr; border-radius: var(--radius-lg); } }
  .stat .value{ font-weight:900; font-size:1.6rem; color: var(--pink-900); }
  .stat .label{ color: var(--ink-600); }

  /* Process steps */
  .about-process{ max-width:1320px; margin: 0 auto 26px; padding: 0 16px; }
  .steps{ display:grid; gap:16px; grid-template-columns: repeat(4,1fr); }
  @media (max-width: 992px){ .steps{ grid-template-columns: repeat(2,1fr); } }
  @media (max-width: 576px){ .steps{ grid-template-columns: 1fr; } }
  .step{
    background:#fff; border-radius: var(--radius-lg); padding:16px;
    box-shadow:0 6px 18px rgba(0,0,0,.05);
  }
  .step .num{ font-weight:800; color: var(--pink-900); }

  /* Gallery */
  .about-gallery{ max-width:1320px; margin:0 auto 26px; padding: 0 16px; }
  .about-section-head{
    text-align:center;
    margin:0 auto 26px;
    max-width: 760px;
  }
  .about-section-icon{
    width:46px;
    height:46px;
    border-radius:999px;
    background:#ffe6f0;
    color:#E06BAF;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    font-size:20px;
    box-shadow:0 12px 24px rgba(255,77,166,.18);
    margin:0 auto 10px;
  }
  .about-section-head h2{
    margin:0;
    font-family:"Playfair Display", serif;
    font-weight:600;
    font-size:clamp(1.8rem, 1.6vw + 1.4rem, 2.6rem);
    color:var(--pink-900);
  }
  .about-section-head h2 em{
    font-style:italic;
    color:#E06BAF;
  }
  .about-section-head p{
    margin:10px auto 0;
    color:var(--ink-600);
    font-size:1rem;
    line-height:1.6;
  }
  .gallery-grid{
    column-count:3;
    column-gap:14px;
  }
  .gallery-grid > *{
    display:inline-block;
    width:100%;
    break-inside:avoid;
    margin:0 0 14px;
  }
  .gallery-grid img{
    width:100%;
    height:auto;
    object-fit:contain;
    border-radius: 16px;
    box-shadow:0 8px 18px rgba(0,0,0,.06);
    background:#fff;
  }
  @media (max-width: 900px){
    .gallery-grid{ column-count:2; }
  }
  @media (max-width: 600px){
    .gallery-grid{ column-count:1; }
  }

  /* Testimonials slider */
  .about-testimonials{ max-width:1100px; margin: 0 auto 24px; padding: 0 16px; }
  .slider{
    position: relative; overflow: hidden;
    background:#fff; border-radius: var(--radius-lg); box-shadow:0 6px 18px rgba(0,0,0,.05);
  }
  .slides{ display:flex; transition: transform .35s ease; }
  .slide{ min-width:100%; padding: 26px; text-align:center; color: var(--ink-700); }
  .slide q{ font-size:1.05rem; line-height:1.6; }
  .slide .name{ margin-top:8px; color: var(--ink-600); }
  .slider .nav{ position:absolute; inset: 0; display:flex; align-items:center; justify-content:space-between; pointer-events:none; }
  .slider button{ pointer-events:auto; border:0; background:#fff; border-radius:999px; padding:10px 12px; box-shadow:0 8px 18px rgba(0,0,0,.12); cursor:pointer; }
  .dots{ display:flex; gap:6px; justify-content:center; padding:10px 0 16px; }
  .dot{ width:8px; height:8px; border-radius:50%; background: #f0b3cf; }
  .dot.active{ background: var(--pink-900); }

  /* CTA card */
  .about-cta{
    max-width:1100px; margin: 0 auto 40px; padding: 22px 18px;
    background:#fff; border-radius: var(--radius-lg); box-shadow: var(--shadow-md);
    text-align:center;
  }