/* =========================================================
   SHARED SECTION STYLES
========================================================= */

:root{
  --section-space:clamp(8rem,10vw,10rem);
  --content-max:1320px;
}

/* =========================================================
   GLOBAL SECTIONS
========================================================= */

.story-section,
.promise-section,
.difference-showcase,
.services-showcase,
.booking-cta{
  position:relative;
  overflow:hidden;
  padding:var(--section-space) 24px;
}

.story-section .container,
.promise-section .container,
.difference-showcase .container,
.services-showcase .container,
.booking-cta .container{
  position:relative;
  z-index:2;
}

/* =========================================================
   SECTION HEADINGS
========================================================= */

.section-heading{
  max-width:840px;
  margin:0 auto 72px;
  text-align:center;
}

.section-eyebrow{
  display:inline-flex;
  align-items:center;
  gap:14px;

  margin-bottom:18px;

  color:var(--brand-mauve);

  font-size:.84rem;
  font-weight:700;
  letter-spacing:.18em;
  text-transform:uppercase;
}

.section-eyebrow::before{

content:"";

width:56px;
height:2px;

border-radius:999px;

background:
linear-gradient(
90deg,
var(--brand-gold),
transparent
);

}

.section-heading h2,
.story-copy h2,
.promise-inner h2,
.booking-cta h2{

margin:0;

color:var(--brand-purple);

font-family:var(--font-heading);

font-size:clamp(3rem,5vw,5.3rem);

font-weight:400;

letter-spacing:-.02em;

line-height:.96;

text-wrap:balance;

}

.section-heading > p:last-child{

max-width:720px;

margin:24px auto 0;

color:var(--color-text-muted);

font-size:1.08rem;

line-height:1.9;

}

/* =========================================================
   GOLD DIVIDER
========================================================= */

.gold-paw-divider{

display:flex;
align-items:center;
gap:18px;

margin:34px 0;

}

.gold-paw-divider span{

flex:1;

max-width:95px;

height:1px;

background:

linear-gradient(
90deg,
transparent,
var(--brand-gold),
transparent
);

}

.gold-paw-divider strong{

font-size:1.55rem;

color:var(--brand-gold);

transition:

transform .4s ease,
color .4s ease;

}

.gold-paw-divider:hover strong{

transform:
rotate(-8deg)
scale(1.12);

}

/* =========================================================
   DECORATIVE BACKGROUNDS
========================================================= */

.story-section::before,
.services-showcase::before,
.booking-cta::before{

content:"";

position:absolute;

width:620px;
height:620px;

background:
url("/assets/images/walking-paw.png")
center/contain
no-repeat;

opacity:.025;

pointer-events:none;

animation:
pawFloat 34s ease-in-out infinite;

}

.story-section::before{

top:-140px;
right:-180px;

}

.services-showcase::before{

left:-180px;
bottom:-180px;

animation-delay:8s;

}

.booking-cta::before{

right:-180px;
top:-120px;

animation-delay:16s;

}

@keyframes pawFloat{

0%,100%{

transform:
translateY(0)
rotate(0deg);

}

50%{

transform:
translateY(-16px)
rotate(3deg);

}

}

/* =========================================================
   SECTION 2
   DAISY STORY
========================================================= */

.story-section-daisy{

position:relative;

background:

radial-gradient(
circle at top left,
rgba(199,173,182,.16),
transparent 42%
),

radial-gradient(
circle at bottom right,
rgba(112,71,163,.05),
transparent 36%
),

#faf8f6;

}

.story-section-daisy .story-grid{

display:grid;

grid-template-columns:

minmax(0,.95fr)
minmax(0,1.05fr);

align-items:center;

gap:clamp(70px,8vw,120px);

}

.story-photo-wrap{

position:relative;

width:100%;

height:650px;

}

.story-photo-accent{

position:absolute;

top:26px;
left:26px;

width:100%;
height:100%;

border-radius:42px;

background:

linear-gradient(
145deg,
rgba(212,174,112,.22),
rgba(199,173,182,.18)
);

}

.story-photo{

position:relative;

z-index:2;

width:100%;
height:650px;

display:block;

object-fit:cover;
object-position:center bottom;

border-radius:42px;

box-shadow:

0 42px 90px
rgba(74,48,82,.14);

transition:

transform .8s ease,

box-shadow .8s ease;

}

.story-photo:hover{

transform:

translateY(-10px)
scale(1.02);

box-shadow:

0 60px 120px
rgba(74,48,82,.18);

}

.story-copy{

max-width:610px;

}

.story-copy h2{

margin-bottom:18px;

color:var(--brand-purple);

}

.story-name-title{

display:flex;

align-items:flex-end;

flex-wrap:wrap;

gap:18px;

margin:8px 0 30px;

}

.story-name-prefix{

color:var(--color-charcoal);

font-family:var(--font-heading);

font-size:clamp(3rem,5vw,5rem);

font-weight:600;

line-height:.9;

}

.story-name-script{

color:var(--brand-mauve);

font-family:var(--font-script);

font-size:clamp(5rem,7vw,7.6rem);

font-weight:400;

line-height:.72;

}

.story-lead{

margin-bottom:28px;

color:var(--brand-mauve);

font-family:var(--font-heading);

font-size:clamp(1.7rem,2vw,2.35rem);

line-height:1.18;

}

.story-copy p{

margin-top:18px;

color:var(--color-text-muted);

font-size:1.06rem;

line-height:1.95;

}

.story-cutout{

display:none;

}

/* =========================================================
   SECTION 3
   NITA KAY STORY
========================================================= */

.story-section-nita{

position:relative;

background:

radial-gradient(
circle at top right,
rgba(199,173,182,.14),
transparent 38%
),

radial-gradient(
circle at bottom left,
rgba(212,174,112,.08),
transparent 34%
),

#ffffff;

}

.story-section-nita .story-grid{

display:grid;

grid-template-columns:

minmax(0,1.05fr)
minmax(0,.95fr);

align-items:center;

gap:clamp(70px,8vw,120px);

}

.story-grid-reverse .story-copy{

order:1;

}

.story-grid-reverse .story-photo-wrap{

order:2;

}

.story-section-nita .story-photo-wrap{

position:relative;

width:100%;

height:650px;

}

.story-section-nita .story-photo-accent{

position:absolute;

top:26px;
left:26px;

width:100%;
height:100%;

border-radius:42px;

background:

linear-gradient(
145deg,
rgba(199,173,182,.18),
rgba(212,174,112,.16)
);

opacity:.9;

}

.story-section-nita .story-photo{

position:relative;

z-index:2;

width:100%;
height:650px;

display:block;

object-fit:cover;
object-position:center;

border-radius:42px;

box-shadow:

0 42px 90px
rgba(74,48,82,.14);

transition:

transform .8s ease,

box-shadow .8s ease;

}

.story-section-nita .story-photo:hover{

transform:

translateY(-10px)
scale(1.02);

box-shadow:

0 60px 120px
rgba(74,48,82,.18);

}

.story-section-nita .story-copy{

max-width:610px;

}

.story-section-nita .story-copy h2{

margin-bottom:18px;

color:var(--brand-purple);

}

.story-section-nita .story-lead{

margin-bottom:28px;

color:var(--brand-mauve);

font-family:var(--font-heading);

font-size:clamp(1.7rem,2vw,2.35rem);

line-height:1.18;

}

.story-section-nita .story-copy p{

margin-top:18px;

color:var(--color-text-muted);

font-size:1.06rem;

line-height:1.95;

}

.story-section-nita .suite-plaque-grid{

display:grid;

grid-template-columns:repeat(2,1fr);

gap:14px;

margin:34px 0;

}

.story-section-nita .suite-plaque-grid span{

display:flex;

align-items:center;
justify-content:center;

padding:18px 16px;

background:

rgba(255,255,255,.82);

backdrop-filter:blur(12px);

border:1px solid
rgba(199,173,182,.28);

border-radius:18px;

box-shadow:

0 12px 28px
rgba(74,48,82,.08);

font-family:var(--font-heading);

font-size:1.18rem;

color:var(--brand-purple);

transition:

transform .35s ease,

box-shadow .35s ease;

}

.story-section-nita .suite-plaque-grid span:hover{

transform:

translateY(-4px);

box-shadow:

0 20px 40px
rgba(74,48,82,.12);

}

/* =========================================================
   SECTION 4
   OUR PROMISE
========================================================= */

.promise-section{

position:relative;

overflow:hidden;

padding:110px 24px;

background:

radial-gradient(
circle at top left,
rgba(255,255,255,.10),
transparent 42%
),

radial-gradient(
circle at bottom right,
rgba(255,255,255,.05),
transparent 40%
),

linear-gradient(
135deg,
#8b7185 0%,
#9a8293 38%,
#b49aa8 72%,
#c7adb6 100%
);

}

.promise-section::before{

content:"";

position:absolute;

right:-180px;
top:-180px;

width:720px;
height:720px;

background:
url("/assets/images/walking-paw.png")
center/contain
no-repeat;

opacity:.025;

pointer-events:none;

animation:
promiseFloat 36s ease-in-out infinite;

}

@keyframes promiseFloat{

0%,100%{

transform:
translateY(0)
rotate(0deg);

}

50%{

transform:
translateY(-16px)
rotate(3deg);

}

}

.promise-inner{

position:relative;

z-index:2;

max-width:940px;

margin:auto;

text-align:center;

}

.promise-inner .section-eyebrow{

justify-content:center;

color:

rgba(255,255,255,.92);

}

.promise-inner h2{

margin-bottom:26px;

color:#ffffff;

font-size:

clamp(3.2rem,5vw,5.2rem);

}

.promise-inner p{

max-width:760px;

margin:auto;

color:

rgba(255,255,255,.92);

font-size:1.12rem;

line-height:2;

}

.promise-inner .gold-paw-divider{

justify-content:center;

margin:36px 0;

}

.promise-inner .gold-paw-divider span{

background:

linear-gradient(
90deg,
transparent,
rgba(255,255,255,.55),
transparent
);

}

.promise-inner .gold-paw-divider strong{

color:#f4df9f;

}

.promise-signature{

margin-top:42px;

display:flex;

flex-direction:column;

align-items:center;

gap:14px;

}

.promise-signature img{

width:170px;

height:auto;

opacity:.92;

filter:

drop-shadow(
0 10px 20px rgba(0,0,0,.12)
);

}

.promise-signature span{

font-family:var(--font-script);

font-size:2rem;

color:rgba(255,255,255,.96);

letter-spacing:.02em;

}

/* =========================================================
   SECTION 5
   THE DAISY DIFFERENCE
========================================================= */

.difference-showcase{

position:relative;

background:#ffffff;

padding:140px 24px;

overflow:hidden;

}

.difference-showcase::before{

content:"";

position:absolute;

left:-220px;
top:-180px;

width:760px;
height:760px;

background:
url("/assets/images/walking-paw.png")
center/contain
no-repeat;

opacity:.022;

pointer-events:none;

animation:
differenceFloat 38s ease-in-out infinite;

}

@keyframes differenceFloat{

0%,100%{

transform:
translateY(0)
rotate(0deg);

}

50%{

transform:
translateY(-18px)
rotate(-4deg);

}

}

.difference-showcase-grid{

position:relative;

z-index:2;

display:grid;

gap:42px;

}

.difference-feature{

display:grid;

grid-template-columns:
1.05fr
.95fr;

align-items:stretch;

overflow:hidden;

border-radius:40px;

background:#faf8f6;

box-shadow:

0 24px 54px
rgba(74,48,82,.08);

transition:

transform .45s ease,

box-shadow .45s ease;

}

.difference-feature:hover{

transform:

translateY(-8px);

box-shadow:

0 36px 74px
rgba(74,48,82,.12);

}

.difference-feature-reverse img{

order:2;

}

.difference-feature-reverse > div{

order:1;

}

.difference-feature img{

width:100%;
height:100%;

min-height:470px;

display:block;

object-fit:cover;

transition:

transform .9s ease;

}

.difference-feature:hover img{

transform:scale(1.04);

}

.difference-feature > div{

display:flex;

flex-direction:column;

justify-content:center;

padding:64px;

}

.difference-number{

margin-bottom:18px;

color:var(--brand-gold);

font-size:.82rem;

font-weight:700;

letter-spacing:.22em;

text-transform:uppercase;

}

.difference-feature h3{

margin:0;

color:var(--brand-purple);

font-family:var(--font-heading);

font-size:

clamp(2.7rem,4vw,4.2rem);

font-weight:400;

line-height:.94;

letter-spacing:-.02em;

}

.difference-feature p{

margin-top:24px;

color:var(--color-text-muted);

font-size:1.06rem;

line-height:1.95;

}

.difference-feature .button{

margin-top:34px;

align-self:flex-start;

}

/* =========================================================
   SECTION 6
   PREMIUM SERVICE CARDS
========================================================= */

.services-showcase{

position:relative;

overflow:hidden;

padding:140px 24px;

background:

radial-gradient(
circle at top left,
rgba(199,173,182,.10),
transparent 42%
),

#faf8f6;

}

.services-showcase::before{

content:"";

position:absolute;

left:-220px;
bottom:-220px;

width:760px;
height:760px;

background:
url("/assets/images/walking-paw.png")
center/contain
no-repeat;

opacity:.022;

pointer-events:none;

animation:
servicesFloat 42s ease-in-out infinite;

}

@keyframes servicesFloat{

0%,100%{

transform:
translateY(0)
rotate(0deg);

}

50%{

transform:
translateY(-18px)
rotate(4deg);

}

}

.services-showcase-grid{

position:relative;

z-index:2;

display:grid;

grid-template-columns:repeat(3,1fr);

gap:30px;

align-items:stretch;

}

.service-image-card{

position:relative;

min-height:610px;

overflow:hidden;

border-radius:36px;

isolation:isolate;

background:#ffffff;

box-shadow:

0 22px 48px
rgba(74,48,82,.10);

transition:

transform .45s ease,

box-shadow .45s ease;

}

.service-image-card:hover{

transform:

translateY(-10px);

box-shadow:

0 42px 90px
rgba(74,48,82,.16);

}

.service-image-card img{

position:absolute;

inset:0;

width:100%;
height:100%;

object-fit:cover;

transition:

transform 1s ease;

}

.service-image-card:hover img{

transform:scale(1.05);

}

.service-image-overlay{

position:absolute;

inset:0;

background:

linear-gradient(

180deg,

rgba(20,16,22,.04) 12%,

rgba(42,31,47,.28) 56%,

rgba(38,26,43,.88) 100%

);

transition:

background .45s ease;

}

.service-image-card:hover .service-image-overlay{

background:

linear-gradient(

180deg,

rgba(20,16,22,.02) 8%,

rgba(112,71,163,.18) 54%,

rgba(42,31,47,.76) 100%

);

}

.service-card-front{

position:absolute;

left:0;
right:0;
bottom:0;

z-index:3;

padding:38px;

color:#ffffff;

transition:

opacity .4s ease,

transform .45s ease;

}

.service-card-front p{

margin-bottom:12px;

color:var(--brand-cream);

font-size:.78rem;

font-weight:800;

letter-spacing:.14em;

text-transform:uppercase;

}

.service-card-front h3{

margin:0;

max-width:320px;

font-family:var(--font-heading);

font-size:

clamp(2.7rem,3.8vw,4rem);

font-weight:400;

line-height:.92;

letter-spacing:-.02em;

}

.service-card-drawer{

position:absolute;

left:18px;
right:18px;
bottom:18px;

z-index:4;

padding:30px;

background:

rgba(250,248,246,.97);

backdrop-filter:blur(18px);

border:

1px solid rgba(199,173,182,.32);

border-radius:24px;

box-shadow:

0 22px 48px
rgba(36,20,43,.18);

opacity:0;

transform:

translateY(calc(100% + 36px));

transition:

opacity .45s ease,

transform .5s cubic-bezier(.2,.8,.2,1);

}

.service-card-drawer p{

margin:0;

color:var(--color-text-muted);

font-size:1rem;

line-height:1.85;

}

.service-card-drawer span{

display:inline-flex;

align-items:center;

gap:8px;

margin-top:22px;

color:var(--brand-purple);

font-weight:700;

}

.service-image-card:hover .service-card-front{

opacity:0;

transform:

translateY(36px);

}

.service-image-card:hover .service-card-drawer{

opacity:1;

transform:translateY(0);

}

/* =========================================================
   SECTION 7
   FINAL CALL TO ACTION
========================================================= */

.booking-cta{

position:relative;

overflow:hidden;

padding:110px 24px;

background:

radial-gradient(
circle at bottom right,
rgba(199,173,182,.12),
transparent 42%
),

radial-gradient(
circle at top left,
rgba(112,71,163,.04),
transparent 36%
),

#faf8f6;

}

.booking-cta::before{

content:"";

position:absolute;

right:-180px;
bottom:-180px;

width:720px;
height:720px;

background:
url("/assets/images/walking-paw.png")
center/contain
no-repeat;

opacity:.022;

pointer-events:none;

animation:
ctaFloat 40s ease-in-out infinite;

}

@keyframes ctaFloat{

0%,100%{

transform:
translateY(0)
rotate(0deg);

}

50%{

transform:
translateY(-18px)
rotate(-3deg);

}

}

.booking-cta-inner{

position:relative;

z-index:2;

display:grid;

grid-template-columns:

170px
1fr
auto;

align-items:center;

gap:48px;

max-width:1320px;

margin:auto;

}

.booking-cta img{

width:150px;
height:150px;

object-fit:contain;

opacity:.95;

filter:

drop-shadow(
0 18px 30px rgba(112,71,163,.14)
);

animation:

logoFloat 14s ease-in-out infinite;

}

@keyframes logoFloat{

0%,100%{

transform:translateY(0);

}

50%{

transform:translateY(-8px);

}

}

.booking-cta-copy{

max-width:650px;

}

.booking-cta .section-eyebrow{

margin-bottom:14px;

}

.booking-cta h2{

margin:0;

color:var(--brand-purple);

font-family:var(--font-heading);

font-size:

clamp(3rem,5vw,5rem);

font-weight:400;

line-height:.95;

letter-spacing:-.02em;

}

.booking-cta p{

margin-top:18px;

color:var(--color-text-muted);

font-size:1.08rem;

line-height:1.9;

}

.booking-cta .button{

min-width:240px;

justify-self:end;

box-shadow:

0 18px 40px
rgba(112,71,163,.18);

}

.booking-cta .button:hover{

transform:

translateY(-5px);

box-shadow:

0 28px 54px
rgba(112,71,163,.24);

}

/* =========================================================
   RESPONSIVE
========================================================= */

@media (max-width:1100px){

.booking-cta-inner{

grid-template-columns:1fr;

text-align:center;

justify-items:center;

gap:34px;

}

.booking-cta-copy{

max-width:760px;

}

.booking-cta .button{

justify-self:center;

}

}

@media (max-width:768px){

.booking-cta{

padding:90px 24px;

}

.booking-cta img{

width:120px;
height:120px;

}

.booking-cta h2{

font-size:

clamp(2.5rem,8vw,3.8rem);

}

.booking-cta p{

font-size:1rem;

}

.booking-cta .button{

width:100%;
max-width:340px;

}

}

/* =========================================================
   SECTION 8
   GLOBAL RESPONSIVE LAYOUT
========================================================= */

@media (max-width:1200px){

  .story-grid,
  .story-section-daisy .story-grid,
  .story-section-nita .story-grid{

    gap:60px;

  }

  .difference-feature{

    grid-template-columns:1fr;

  }

  .difference-feature img{

    min-height:380px;

  }

  .services-showcase-grid{

    grid-template-columns:
      repeat(2,1fr);

    gap:24px;

  }

}

@media (max-width:992px){

  .story-grid,
  .story-section-daisy .story-grid,
  .story-section-nita .story-grid{

    grid-template-columns:1fr;

    gap:54px;

  }

  .story-grid-reverse .story-photo-wrap,
  .story-grid-reverse .story-copy{

    order:initial;

  }

  .story-photo-wrap,
  .story-section-daisy .story-photo-wrap,
  .story-section-nita .story-photo-wrap{

    height:560px;

  }

  .story-photo,
  .story-section-daisy .story-photo,
  .story-section-nita .story-photo{

    height:560px;

  }

  .story-copy{

    max-width:100%;

  }

  .story-name-title{

    justify-content:center;

    text-align:center;

  }

  .story-copy{

    text-align:center;

  }

  .gold-paw-divider{

    justify-content:center;

  }

  .difference-feature > div{

    padding:46px;

  }

}

@media (max-width:768px){

  .story-section,
  .promise-section,
  .difference-showcase,
  .services-showcase,
  .booking-cta{

    padding:90px 22px;

  }

  .section-heading{

    margin-bottom:54px;

  }

  .section-heading h2,
  .story-copy h2,
  .promise-inner h2,
  .booking-cta h2{

    font-size:

      clamp(2.5rem,8vw,3.8rem);

  }

  .story-name-title{

    flex-direction:column;

    align-items:center;

    gap:8px;

  }

  .story-name-prefix{

    padding:0;

  }

  .story-name-script{

    line-height:.85;

  }

  .story-photo-wrap,
  .story-section-daisy .story-photo-wrap,
  .story-section-nita .story-photo-wrap{

    height:460px;

  }

  .story-photo,
  .story-section-daisy .story-photo,
  .story-section-nita .story-photo{

    height:460px;

  }

  .story-photo-accent{

    top:18px;
    left:18px;

  }

  .suite-plaque-grid,
  .story-section-nita .suite-plaque-grid{

    grid-template-columns:1fr;

  }

  .services-showcase-grid{

    grid-template-columns:1fr;

  }

  .service-image-card{

    min-height:520px;

  }

  .service-card-front{

    padding:28px;

  }

  .service-card-drawer{

    left:14px;
    right:14px;
    bottom:14px;

    padding:22px;

  }

  .difference-feature{

    border-radius:30px;

  }

  .difference-feature img{

    min-height:300px;

  }

  .difference-feature > div{

    padding:34px;

  }

}

@media (max-width:480px){

  .story-section,
  .promise-section,
  .difference-showcase,
  .services-showcase,
  .booking-cta{

    padding:72px 20px;

  }

  .section-heading{

    margin-bottom:42px;

  }

  .story-photo-wrap,
  .story-section-daisy .story-photo-wrap,
  .story-section-nita .story-photo-wrap{

    height:380px;

  }

  .story-photo,
  .story-section-daisy .story-photo,
  .story-section-nita .story-photo{

    height:380px;

  }

  .story-photo,
  .story-photo-accent{

    border-radius:28px;

  }

  .service-image-card{

    min-height:460px;

    border-radius:28px;

  }

  .button{

    width:100%;

  }

}

/* =========================================================
   REDUCED MOTION
========================================================= */

@media (prefers-reduced-motion:reduce){

  .story-photo,
  .difference-feature,
  .service-image-card,
  .button,
  .story-section::before,
  .services-showcase::before,
  .booking-cta::before{

    animation:none !important;

    transition:none !important;

    transform:none !important;

  }

}

/* =========================================================
   HOME STORY — DAISY
========================================================= */

.home-story{
    position:relative;
    overflow:hidden;
    padding:10rem 0;
    background:
        radial-gradient(circle at left top,rgba(199,173,182,.18),transparent 40%),
        linear-gradient(180deg,#faf8f6 0%,#ffffff 100%);
}

.home-story__watermark{
    position:absolute;
    left:50%;
    top:40px;
    transform:translateX(-50%);
    font-family:var(--font-heading);
    font-size:clamp(10rem,22vw,18rem);
    font-weight:700;
    letter-spacing:.08em;
    color:#8b7185;
    opacity:.035;
    pointer-events:none;
    user-select:none;
    white-space:nowrap;
}

.home-story__pawtrail{
    position:absolute;
    right:-80px;
    top:80px;
    width:340px;
    opacity:.05;
    animation:homePawFloat 18s ease-in-out infinite;
}

@keyframes homePawFloat{

0%,100%{
transform:translateY(0);
}

50%{
transform:translateY(-18px);
}

}

.home-story__layout{

display:grid;

grid-template-columns:1.08fr .92fr;

gap:7rem;

align-items:center;

position:relative;

z-index:2;

}

.home-story__image{

position:relative;

}

.home-story__image-shadow{

position:absolute;

left:28px;
top:28px;

width:100%;
height:100%;

border-radius:40px;

background:
linear-gradient(
135deg,
rgba(199,173,182,.45),
rgba(112,71,163,.18)
);

}

.home-story__image img{

position:relative;

display:block;

width:100%;

border-radius:40px;

box-shadow:
0 45px 90px rgba(35,25,40,.18);

transition:
transform .7s ease,
box-shadow .7s ease;

}

.home-story__image:hover img{

transform:
translateY(-10px)
scale(1.02);

box-shadow:
0 60px 120px rgba(35,25,40,.22);

}

.home-story__content{

position:relative;

}

.home-story__eyebrow{

margin-bottom:18px;

font-size:.82rem;

font-weight:700;

letter-spacing:.20em;

text-transform:uppercase;

color:var(--brand-mauve);

}

.home-story__title{

margin:0;

line-height:.88;

}

.home-story__title span{

display:block;

font-family:var(--font-heading);

font-size:clamp(3.2rem,5vw,5rem);

color:#2f2f2f;

}

.home-story__title strong{

display:block;

font-family:var(--font-script);

font-size:clamp(5.5rem,8vw,8rem);

font-weight:400;

color:var(--brand-mauve);

}

.home-story__lead{

margin:30px 0;

font-family:var(--font-heading);

font-size:clamp(1.8rem,2vw,2.5rem);

line-height:1.2;

color:var(--brand-mauve);

}

.home-story__card{

padding:38px;

border-radius:30px;

background:rgba(255,255,255,.88);

backdrop-filter:blur(20px);

border:1px solid rgba(199,173,182,.28);

box-shadow:
0 24px 60px rgba(40,28,45,.08);

}

.home-story__card p{

margin:0 0 18px;

line-height:1.9;

}

.home-story__card p:last-child{

margin-bottom:0;

}

.home-story__divider{

display:flex;

align-items:center;

gap:18px;

margin:42px 0;

}

.home-story__divider span{

flex:1;

height:1px;

background:
linear-gradient(
90deg,
transparent,
rgba(212,174,112,.9),
transparent
);

}

.home-story__divider img{

width:36px;
height:36px;
display:block;

}

@media (max-width:980px){

.home-story{

padding:7rem 0;

}

.home-story__layout{

grid-template-columns:1fr;

gap:4rem;

}

.home-story__content{

text-align:center;

}

.home-story__divider{

justify-content:center;

}

}

