:root{
  color-scheme:only light;
  --ink:#16193A;
  --ink-soft:#565A76;
  --ivory:#FFFFFF;
  --ivory-deep:#EFEEFB;
  --green:#1A0DA5;
  --green-deep:#0B0452;
  --green-mist:#ECE9FF;
  --accent:#1400FF;
  --accent-soft:#B9B3FF;
  --gold:#1400FF;
  --line:#DAD5F5;
  --shadow: 0 20px 50px -25px rgba(11,4,82,0.35);
}
*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  margin:0;
  background:var(--ivory);
  color:var(--ink);
  font-family:'Jost', sans-serif;
  font-weight:400;
  line-height:1.7;
  -webkit-font-smoothing:antialiased;
}
img{max-width:100%;display:block;}
a{color:inherit;text-decoration:none;}
h1,h2,h3,h4{
  font-family:'Cormorant Garamond', serif;
  font-weight:600;
  color:var(--green-deep);
  margin:0 0 .5em;
  letter-spacing:.01em;
}
.eyebrow{
  font-family:'Jost',sans-serif;
  text-transform:uppercase;
  letter-spacing:.28em;
  font-size:.72rem;
  color:var(--accent);
  font-weight:500;
  display:inline-block;
  margin-bottom:14px;
}
.wrap{max-width:1180px;margin:0 auto;padding:0 28px;}
section{padding:100px 0;}
.center{text-align:center;}
.lede{max-width:640px;margin:0 auto 56px;color:var(--ink-soft);font-size:1.05rem;}
.lede.left{margin:0 0 40px;}
.divider{width:56px;height:2px;background:var(--gold);margin:22px auto;}
.divider.left{margin:22px 0;}
.btn{
  display:inline-flex;align-items:center;gap:10px;
  padding:15px 34px;
  border:1px solid var(--green);
  color:var(--green-deep);
  font-size:.82rem;letter-spacing:.14em;text-transform:uppercase;
  transition:all .25s ease;
  background:transparent;
  cursor:pointer;
}
.btn:hover{background:var(--green);color:#fff;}
.btn.solid{background:var(--green);color:#fff;}
.btn.solid:hover{background:var(--green-deep);}
.btn.accent{border-color:var(--accent);color:var(--accent);}
.btn.accent:hover{background:var(--accent);color:#fff;}
.btn.accent-solid{background:var(--accent);color:#fff;border-color:var(--accent);}
.btn.accent-solid:hover{background:#1000CC;}
.btn.white-solid{background:#fff;color:var(--green-deep);border-color:#fff;}
.btn.white-solid:hover{background:var(--ivory-deep);}
.btn.pill{border-radius:30px;padding:15px 32px;}
.hl{color:var(--accent);font-style:italic;}
.hero .hl, .page-hero .hl, .quality .hl, .contact .hl{color:var(--accent-soft);}

/* Header */
header{
  position:fixed;top:0;left:0;right:0;z-index:300;
}
.nav-shell{
  display:grid;grid-template-columns:300px minmax(0,1fr);align-items:stretch;
}
.logo-panel{
  grid-column:1;display:flex;align-items:center;gap:12px;
  /* Blush banner with soft roses at the edges, kept pale so the wine-red
     name and the logo read clearly on top. */
  background:
    linear-gradient(90deg, rgba(253,242,234,0) 0%, rgba(253,242,234,.8) 55%, rgba(253,242,234,.8) 90%, rgba(253,242,234,0) 100%),
    url('../images/logo-bg.webp?v=136d7fee') right center/cover no-repeat,
    #FDF2EA;
  padding:16px 26px 16px 14px;
  box-shadow:0 2px 20px rgba(11,4,82,.08);
}
.logo-panel .brand-text .name{color:#7A1630;}
.logo-panel .brand-text .tag{color:#7A1630;letter-spacing:.24em;}
.logo-panel img{height:44px;width:auto;transition:height .3s ease;}
header.scrolled .logo-panel img{height:36px;}
.brand-text{font-family:'Cormorant Garamond',serif;line-height:1.1;}
.brand-text .name{font-family:'EB Garamond',serif;font-size:1.2rem;font-weight:700;white-space:nowrap;color:var(--green-deep);}
.brand-text .tag{font-size:.6rem;letter-spacing:.2em;text-transform:uppercase;color:var(--accent);font-family:'Jost',sans-serif;}

.nav-stack{grid-column:2;display:flex;flex-direction:column;}

/* Top utility bar */
.topbar{
  background:var(--green-deep);color:#C7C1EE;font-size:.78rem;
  padding:9px 0;position:relative;z-index:2;
}
header.scrolled .topbar{display:none;}
.topbar .wrap{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:10px;max-width:none;margin:0;padding:0 28px;}
.topbar-links{display:flex;gap:24px;flex-wrap:wrap;}
.topbar-links a:hover{color:#fff;}
.topbar-links .ico{color:var(--accent-soft);margin-right:6px;}

.nav-main{
  flex:1;display:flex;align-items:center;justify-content:space-between;gap:24px;
  padding:0 28px;min-height:70px;background:var(--accent);
  overflow:hidden;
  transition:min-height .3s ease, box-shadow .3s ease;
}
header.scrolled .nav-main{
  min-height:58px;box-shadow:0 10px 30px -16px rgba(11,4,82,.5);
}

nav.main-nav ul{display:flex;gap:34px;list-style:none;margin:0;padding:0;align-items:center;}
nav.main-nav a{
  display:inline-flex;align-items:center;gap:10px;
  font-size:.8rem;letter-spacing:.08em;text-transform:uppercase;color:#fff;
  position:relative;padding-bottom:4px;
}
nav.main-nav a::after{content:"";position:absolute;left:0;bottom:0;width:0;height:1px;background:#fff;transition:width .25s ease;}
nav.main-nav a:hover::after, nav.main-nav a.active::after{width:100%;}
nav.main-nav .nav-icon{display:none;}
.nav-mobile-actions{display:none;}
.nav-menu-brand{display:none;}

.nav-actions{display:flex;align-items:center;gap:18px;}

.hamburger{
  display:none;flex-direction:column;justify-content:center;gap:5px;
  width:40px;height:40px;background:none;border:none;cursor:pointer;padding:0;margin-left:auto;
}
.hamburger span{display:block;width:24px;height:2px;background:#fff;transition:transform .3s ease, opacity .3s ease;}
.hamburger.active span:nth-child(1){transform:translateY(7px) rotate(45deg);}
.hamburger.active span:nth-child(2){opacity:0;}
.hamburger.active span:nth-child(3){transform:translateY(-7px) rotate(-45deg);}

body.nav-open{overflow:hidden;}
body.nav-open::before{
  content:"";position:fixed;inset:0;z-index:150;
  background:rgba(11,4,82,.55);backdrop-filter:blur(2px);
}

/* Hero slider (home) */
.hero{
  position:relative;
  height:100vh;
  min-height:640px;
  overflow:hidden;
  display:flex;align-items:center;
}
.hero-slide{
  position:absolute;inset:0;
  background-size:cover;background-position:center 30%;
  opacity:0;transition:opacity 1.6s linear;
  display:flex;align-items:center;
}
/* No colour wash over the slides - the photos show in their own colour.
   Legibility comes from the shadow on .hero-content below. */
/* This banner is 2.16:1 with a soft left third: on wide screens that empty area
   sits behind the copy, but a tall phone crop would show nothing but the wash. */
.hero-slide--soft-left{background-position:left center;}
@media (max-width:720px){
  .hero-slide--soft-left{background-position:65% center;}
}
.hero-slide.is-active{opacity:1;z-index:1;}
/* The outgoing slide stays fully opaque one layer down while the incoming one
   fades in over it. Fading both at once lets the page show through the middle
   of the dissolve, which is what makes a crossfade read as a switch. */
.hero-slide.is-leaving{opacity:1;z-index:0;transition:none;}
/* The clip fills the slide edge to edge - a viewport taller or wider than the
   16:9 source crops the sides rather than leaving bars. The slide's own
   background holds the poster, which covers the same way while the clip loads. */
.hero-video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;}
.hero-slide--video{overflow:hidden;background-position:center;}
/* Honour reduced-motion: hide the clip and leave the poster showing */
@media (prefers-reduced-motion:reduce){
  .hero-video{display:none;}
}
.hero-content{position:relative;z-index:2;width:100%;color:#fff;
  text-shadow:0 1px 4px rgba(11,4,82,.9), 0 4px 22px rgba(11,4,82,.75);}
/* Hero copy sits nearer the viewport edge than the standard page gutter */
.hero-content{max-width:none;padding-left:clamp(20px,3vw,44px);}
.hero-content h1{max-width:760px;}
.hero h1 .line{display:block;}
.hero-word{
  display:inline-block;transition:opacity .35s ease;
  font-family:'Satisfy',cursive;font-style:normal;font-weight:400;
  font-size:1.12em;line-height:1;padding-right:.06em;
}
.hero-word.is-swapping{opacity:0;}
/* Rotating word: solid yellow with a crisp (zero-blur) outline instead of the soft glow */
.hero .hero-word{
  color:#FFD23F;
  text-shadow:0 2px 0 var(--green-deep), 1px 0 0 var(--green-deep), -1px 0 0 var(--green-deep), 0 -1px 0 var(--green-deep);
}
.hero .eyebrow{color:var(--accent-soft);}
.hero h1{
  color:#fff;font-size:clamp(2.4rem,5.4vw,4.1rem);font-weight:500;
  line-height:1.1;margin-bottom:22px;
}
.hero p{color:#E7E4FF;font-size:1.08rem;max-width:560px;margin-bottom:38px;}
.hero-actions{display:flex;gap:18px;flex-wrap:wrap;}
.btn.is-static{cursor:default;pointer-events:none;}
.btn.on-dark{border-color:rgba(255,255,255,.65);color:#fff;}
.btn.on-dark:hover{background:#fff;color:var(--green-deep);}
.hero-dots{
  position:absolute;bottom:clamp(60px,6vw,104px);left:50%;transform:translateX(-50%);z-index:3;
  display:flex;gap:12px;
}
.hero-dots{gap:0;}
.hero-dots button{
  width:24px;height:24px;border:0;background:transparent;padding:0;cursor:pointer;
  display:grid;place-items:center;
}
.hero-dots button::before{
  content:"";width:9px;height:9px;border-radius:50%;border:1px solid rgba(255,255,255,.7);
  box-sizing:border-box;transition:background .25s ease;
}
.hero-dots button.is-active::before{background:#fff;}

/* Page hero (inner pages) */
.page-hero{
  position:relative;height:44vh;min-height:300px;
  display:flex;align-items:flex-end;
  color:#fff;padding-bottom:56px;
  background-size:cover;background-position:center;
}
.page-hero::before{
  content:"";position:absolute;inset:0;
  background:linear-gradient(180deg, rgba(11,4,82,.5), rgba(11,4,82,.85));
}
.page-hero .wrap{position:relative;width:100%;}
.page-hero .eyebrow{color:var(--accent-soft);}
.page-hero h1{color:#fff;font-size:clamp(2rem,4.5vw,3.1rem);margin-bottom:10px;}
.crumbs{font-size:.8rem;letter-spacing:.04em;color:#D6D2F7;}
.crumbs a{color:#D6D2F7;border-bottom:1px solid rgba(255,255,255,.3);}
.crumbs a:hover{color:#fff;}
.crumbs .sep{margin:0 8px;opacity:.6;}
.crumbs .current{color:#fff;}

/* Stat strip */
.stat-strip{background:var(--green-deep);color:#E7E4FF;padding:0;}
.stat-strip .wrap{display:flex;flex-wrap:wrap;}
.stat{flex:1 1 220px;text-align:center;padding:38px 20px;border-left:1px solid rgba(255,255,255,.1);}
.stat:first-child{border-left:none;}
.stat .num{font-family:'Cormorant Garamond',serif;font-size:2rem;color:var(--accent-soft);}
.stat .cap{font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;color:#B3AEE0;margin-top:6px;}

/* About */
.about{background:var(--ivory);}
.about-grid{display:grid;grid-template-columns:1fr 1fr;gap:70px;align-items:center;}
.about-media{position:relative;}
.about-media img{width:100%;height:520px;object-fit:cover;box-shadow:var(--shadow);}
.about-media .frame{position:absolute;inset:22px -22px -22px 22px;border:1px solid var(--gold);z-index:-1;}
.about h2{font-size:2.1rem;}
.about p{color:var(--ink-soft);}
.info-cards{display:grid;grid-template-columns:1fr 1fr;gap:22px;margin-top:36px;}
.info-card{border-top:2px solid var(--accent);padding-top:16px;}
.info-card h4{font-size:1.15rem;margin-bottom:8px;}
.info-card p{font-size:.92rem;color:var(--ink-soft);margin:0;}

/* Services */
.services{background:var(--green-mist);}
.service-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--line);border:1px solid var(--line);}
.service-card{background:var(--ivory);padding:44px 30px;text-align:left;}
.service-card .num{font-family:'Cormorant Garamond',serif;font-size:1rem;color:var(--accent);letter-spacing:.05em;}
.service-card h3{font-size:1.3rem;margin:14px 0 12px;}
.service-card p{font-size:.92rem;color:var(--ink-soft);margin:0;}

/* Catalogue */
.catalogue{background:var(--ivory);}
.cat-heading{margin:56px 0 26px;display:flex;align-items:baseline;gap:16px;}
.cat-heading h3{font-size:1.5rem;margin:0;}
.cat-heading .count{font-size:.78rem;color:var(--ink-soft);letter-spacing:.08em;text-transform:uppercase;}
.cat-heading .rule{flex:1;height:1px;background:var(--line);}
.cat-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:26px;}
.cat-card{text-align:center;}
.cat-thumb{
  background:#fff;border:1px solid var(--line);
  aspect-ratio:1/1;display:flex;align-items:center;justify-content:center;
  padding:18px;transition:box-shadow .25s ease, transform .25s ease;
}
.cat-thumb img{max-height:100%;object-fit:contain;}
.cat-card:hover .cat-thumb{box-shadow:var(--shadow);transform:translateY(-4px);}
.cat-card h4{font-size:1rem;margin-top:14px;font-weight:600;}
.cat-note{text-align:center;margin-top:50px;color:var(--ink-soft);font-size:.92rem;}
.accessories-note{
  margin-top:70px;padding:40px;background:var(--green-mist);border:1px solid var(--line);
  display:grid;grid-template-columns:1fr auto;gap:30px;align-items:center;
}
.accessories-note h3{font-size:1.3rem;margin-bottom:8px;}
.accessories-note p{margin:0;color:var(--ink-soft);}

/* Arrangements */
.occasion-filter{display:flex;flex-wrap:wrap;justify-content:center;gap:10px;margin-top:-16px;scroll-margin-top:140px;}
.occasion-filter button{
  font-family:'Jost',sans-serif;font-size:.78rem;letter-spacing:.1em;text-transform:uppercase;
  padding:11px 22px;border-radius:30px;border:1px solid var(--line);background:#fff;color:var(--green-deep);
  cursor:pointer;transition:all .2s ease;
}
.occasion-filter button:hover{border-color:var(--accent);color:var(--accent);}
.occasion-filter button.active{background:var(--accent);border-color:var(--accent);color:#fff;}
.arrangement-card[hidden]{display:none;}
.arrangement-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:36px;margin-top:50px;}
.arrangement-card{background:#fff;border:1px solid var(--line);transition:box-shadow .25s ease, transform .25s ease;}
.arrangement-card:hover{box-shadow:var(--shadow);transform:translateY(-4px);}
.arrangement-card .photo{aspect-ratio:3/4;overflow:hidden;}
.arrangement-card .photo img{width:100%;height:100%;object-fit:cover;}
.arrangement-card .info{padding:26px 28px 30px;}
.arrangement-card h3{font-size:1.2rem;margin-bottom:8px;}
.arrangement-card p{font-size:.9rem;color:var(--ink-soft);margin:0 0 20px;}
.arrangement-card .price{font-family:'Jost',sans-serif;font-size:1.05rem;font-weight:600;letter-spacing:.02em;color:var(--accent);margin:0 0 12px;}

/* Quality */
.quality{
  background:linear-gradient(180deg, rgba(11,4,82,.88), rgba(11,4,82,.93)), url('../images/hero-1-poster.jpg?v=fdd0b64b') center/cover fixed;
  color:#E7E4FF;
}
.quality .eyebrow{color:var(--accent-soft);}
.quality h2{color:#fff;}
.quality .lede{color:#D6D2F7;}
.pillars{display:grid;grid-template-columns:repeat(4,1fr);gap:32px;margin-top:20px;}
.pillar{text-align:center;padding:0 10px;}
.pillar .mark{
  width:54px;height:54px;border:1px solid var(--accent-soft);border-radius:50%;
  display:flex;align-items:center;justify-content:center;margin:0 auto 20px;
  font-family:'Cormorant Garamond',serif;font-size:1.3rem;color:var(--accent-soft);
}
.pillar h4{color:#fff;font-size:1.1rem;}
.pillar p{font-size:.88rem;color:#B3AEE0;}

/* Clients */
.clients{background:var(--ivory-deep);}
.client-logos{display:grid;grid-template-columns:repeat(4,1fr);gap:28px;margin:50px 0 46px;}
.client-card{
  margin:0;background:#fff;border-radius:18px;padding:18px 18px 22px;
  box-shadow:0 10px 30px rgba(11,4,82,.08);text-align:center;
  transition:transform .25s ease, box-shadow .25s ease;
}
.client-card:hover{transform:translateY(-4px);box-shadow:0 16px 38px rgba(11,4,82,.14);}
.client-logo{
  height:150px;border-radius:12px;background:#F6F6F8;padding:14px;
  display:flex;align-items:center;justify-content:center;margin-bottom:18px;
}
.client-logo.is-dark{background:#7A1E1E;}
.client-logo img{max-width:100%;max-height:100%;width:auto;height:auto;object-fit:contain;}
.client-card figcaption{font-weight:500;font-size:1.02rem;color:var(--green-deep);line-height:1.3;}
@media (max-width:900px){.client-logos{grid-template-columns:repeat(2,1fr);gap:20px;}}
@media (max-width:420px){.client-logo{height:120px;}.client-card{padding:14px 14px 18px;}.client-card figcaption{font-size:.92rem;}}
.client-note{max-width:720px;margin:0 auto;text-align:center;color:var(--ink-soft);font-size:.98rem;}
.client-note strong{color:var(--green-deep);}

/* Moments strip */
.moments{display:grid;grid-template-columns:1.3fr 1fr 1fr;height:420px;}
.moments figure{margin:0;position:relative;overflow:hidden;}
.moments img{width:100%;height:100%;object-fit:cover;transition:transform .5s ease;}
.moments figure:hover img{transform:scale(1.06);}
.moments figcaption{
  position:absolute;left:0;right:0;bottom:0;padding:24px;
  background:linear-gradient(0deg, rgba(11,4,82,.8), transparent);
  color:#fff;font-family:'Cormorant Garamond',serif;font-size:1.15rem;
}

/* CTA band */
.cta-band{background:var(--green);color:#fff;}
.cta-band .wrap{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:24px;padding:60px 28px;}
.cta-band h2{color:#fff;margin:0;font-size:1.8rem;}
.cta-band p{margin:6px 0 0;color:#D6D2F7;}

/* Contact */
.contact{background:var(--green-deep);color:#E7E4FF;}
.contact .eyebrow{color:var(--accent-soft);}
.contact h2{color:#fff;}
.contact-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:64px;margin-top:20px;}
.contact-list{list-style:none;margin:30px 0 0;padding:0;}
.contact-list li{display:flex;gap:16px;padding:18px 0;border-top:1px solid rgba(255,255,255,.12);}
.contact-list li:last-child{border-bottom:1px solid rgba(255,255,255,.12);}
.contact-list .k{color:var(--accent-soft);font-size:.68rem;letter-spacing:.16em;text-transform:uppercase;width:110px;flex:none;padding-top:3px;}
.contact-list .v{min-width:0;overflow-wrap:anywhere;}
.contact-list .v a{display:block;}
.contact-list .v a:hover{color:var(--accent-soft);}
.map-frame{border:1px solid rgba(255,255,255,.18);height:100%;min-height:340px;filter:grayscale(35%) brightness(.95);}
.map-frame iframe{width:100%;height:100%;border:0;min-height:340px;display:block;}

.method-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:rgba(255,255,255,.14);border:1px solid rgba(255,255,255,.14);margin-top:50px;}
.method-card{background:var(--green-deep);padding:38px 30px;text-align:center;}
.method-card .mark{
  width:48px;height:48px;border:1px solid var(--accent-soft);border-radius:50%;
  display:flex;align-items:center;justify-content:center;margin:0 auto 18px;color:var(--accent-soft);
}
.method-card h4{color:#fff;font-size:1.1rem;margin-bottom:8px;}
.method-card p{font-size:.88rem;color:#B3AEE0;margin:0 0 16px;}
.method-card a.btn{padding:11px 22px;font-size:.72rem;}
/* The accent blue is a light-background colour; on these dark panels it all but
   vanishes, so the label goes white and the accent stays on the outline. */
.method-card a.btn.accent{color:#fff;}
.method-actions{display:flex;flex-direction:column;align-items:center;gap:12px;}

/* Shop-by-occasion row: round photos linking to the filtered arrangements page */
.occasions{padding:clamp(56px,7vw,100px) 0 0;}
.occasions-title{text-align:center;font-size:clamp(1.6rem,3vw,2.3rem);margin:0 auto 44px;max-width:820px;}
.occasion-row{display:grid;grid-template-columns:repeat(6,1fr);gap:28px;}
.occasion-card{display:flex;flex-direction:column;align-items:center;text-align:center;gap:16px;color:var(--ink);}
.occasion-photo{display:block;width:100%;aspect-ratio:1;border-radius:50%;overflow:hidden;box-shadow:var(--shadow);}
.occasion-photo img{width:100%;height:100%;object-fit:cover;transition:transform .5s ease;}
.occasion-card:hover .occasion-photo img,.occasion-card:focus-visible .occasion-photo img{transform:scale(1.06);}
.occasion-name{font-weight:500;font-size:.98rem;transition:color .25s ease;}
.occasion-card:hover .occasion-name,.occasion-card:focus-visible .occasion-name{color:var(--accent);}
@media (max-width:980px){
  .occasion-row{grid-template-columns:repeat(3,1fr);row-gap:36px;max-width:640px;margin-inline:auto;}
}
@media (max-width:720px){
  /* Swipeable row on phones, like the flower strip */
  .occasion-row{display:flex;gap:18px;overflow-x:auto;scroll-snap-type:x mandatory;padding:4px 4px 16px;max-width:none;-webkit-overflow-scrolling:touch;}
  .occasion-card{flex:0 0 132px;scroll-snap-align:start;}
  .occasion-name{font-size:.9rem;}
}

/* Horizontal flower strip */
.strip-scroll{
  display:flex;gap:22px;overflow-x:auto;padding:10px 4px 22px;
  scroll-snap-type:x mandatory;
  -webkit-overflow-scrolling:touch;
}
.strip-scroll::-webkit-scrollbar{height:6px;}
.strip-scroll::-webkit-scrollbar-thumb{background:var(--line);border-radius:3px;}
.strip-card{
  flex:0 0 200px;scroll-snap-align:start;background:#fff;border:1px solid var(--line);
  text-align:center;position:relative;
}
.strip-card .thumb{height:200px;padding:16px;display:flex;align-items:center;justify-content:center;position:relative;}
.strip-card .thumb img{max-height:100%;object-fit:contain;}
.strip-card h4{font-size:.98rem;margin:0;padding:14px 10px 18px;border-top:1px solid var(--line);}
/* Auto-scrolling loop (set up in index.html). Spacing is a right margin rather
   than flex gap so the duplicated half is exactly 50% of the track. */
.strip-scroll.is-marquee{
  display:block;overflow:hidden;padding:16px 0 40px;scroll-snap-type:none;
  /* Break out of .wrap so the cards run the full width of the screen */
  width:100vw;margin-left:calc(50% - 50vw);
}
/* 100vw includes the vertical scrollbar, so clip the few px it overhangs */
.catalogue:has(.is-marquee){overflow-x:clip;}
.strip-track{
  display:flex;width:max-content;
  animation:strip-marquee var(--strip-duration,42s) linear infinite;
}
.strip-scroll.is-marquee:hover .strip-track{animation-play-state:paused;}
.strip-track .strip-card{margin-right:22px;}
/* Lifted card look, matching the client cards */
.strip-track .strip-card{
  border:0;border-radius:18px;padding:14px 14px 0;
  box-shadow:0 10px 30px rgba(11,4,82,.08);
  transition:transform .25s ease, box-shadow .25s ease;
}
.strip-track .strip-card:hover{transform:translateY(-6px);box-shadow:0 16px 38px rgba(11,4,82,.14);}
.strip-track .strip-card .thumb{background:#F6F6F8;border-radius:12px;height:190px;}
/* Photos have white backgrounds; multiply lets them sit cleanly on the grey panel */
.strip-track .strip-card .thumb img{mix-blend-mode:multiply;}
.strip-track .strip-card h4{border-top:0;padding:16px 10px 18px;color:var(--green-deep);}
@keyframes strip-marquee{from{transform:translateX(0);}to{transform:translateX(-50%);}}
@media (prefers-reduced-motion:reduce){
  .strip-scroll.is-marquee{overflow-x:auto;}
  .strip-track{animation:none;}
}

/* Footer */
footer{background:var(--green-deep);color:#9C97C9;}
.footer-cta-bar{border-bottom:1px solid rgba(255,255,255,.12);padding:22px 0;}
.footer-cta-bar .wrap{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:16px;}
.footer-cta-bar .brand-text .name{color:#fff;}
.footer-social{display:flex;gap:14px;}
.footer-social a{
  width:34px;height:34px;border:1px solid rgba(255,255,255,.2);border-radius:50%;
  display:flex;align-items:center;justify-content:center;font-size:.85rem;color:#C7C1EE;
}
.footer-social a:hover{background:var(--accent);border-color:var(--accent);color:#fff;}
.footer-main{padding:60px 0 20px;}
.footer-grid{display:grid;grid-template-columns:1.3fr 1fr 1fr 1fr;gap:40px;}
.footer-title{color:#fff;font-size:1.1rem;margin-bottom:18px;}
.footer-grid p{font-size:.88rem;color:#9C97C9;margin-bottom:18px;}
.newsletter-form{display:flex;border:1px solid rgba(255,255,255,.2);}
.newsletter-form input{
  flex:1;background:transparent;border:0;padding:13px 16px;color:#fff;font-family:'Jost',sans-serif;font-size:.85rem;
}
.newsletter-form input::placeholder{color:#8F89B8;}
.newsletter-form button{
  background:var(--accent);border:0;color:#fff;padding:0 18px;cursor:pointer;font-size:.9rem;
}
.newsletter-form button:hover{background:#1000CC;}
.newsletter-note{font-size:.78rem;color:#8F89B8;margin-top:10px;}
.footer-links-list{list-style:none;margin:0;padding:0;}
.footer-links-list li{margin-bottom:11px;font-size:.88rem;}
.footer-links-list a:hover{color:#fff;}
.footer-gallery{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;}
.footer-gallery a{display:block;aspect-ratio:1/1;overflow:hidden;border:1px solid rgba(255,255,255,.12);}
.footer-gallery img{width:100%;height:100%;object-fit:cover;transition:transform .3s ease;}
.footer-gallery a:hover img{transform:scale(1.12);}
.footer-bottom{border-top:1px solid rgba(255,255,255,.12);padding:20px 0;text-align:center;font-size:.8rem;color:#8F89B8;}

/* Back to top */
.back-to-top{
  position:fixed;right:26px;bottom:234px;z-index:120;
  width:44px;height:44px;border-radius:50%;background:var(--ivory);color:var(--green-deep);
  border:1px solid var(--line);box-shadow:var(--shadow);
  display:flex;align-items:center;justify-content:center;cursor:pointer;
  opacity:0;pointer-events:none;transition:opacity .3s ease, transform .3s ease;
  transform:translateY(10px);
}
.back-to-top.is-visible{opacity:1;pointer-events:auto;transform:translateY(0);}

/* Floating social stack */
.social-float{
  position:fixed;right:26px;z-index:120;
  width:56px;height:56px;border-radius:50%;
  display:flex;align-items:center;justify-content:center;
  box-shadow:0 10px 26px -8px rgba(0,0,0,.5);
  border:1px solid var(--accent-soft);
}
.social-float{background:var(--green);}
.social-float svg{width:24px;height:24px;fill:#E7E4FF;}
.wa-float{bottom:26px;}
.ig-float{bottom:96px;}
.ig-float svg{fill:none;stroke:#E7E4FF;stroke-width:1.8;}
.ig-float svg circle.dot{fill:#E7E4FF;stroke:none;}
.fb-float{bottom:166px;}

@media (max-width:980px){
  .about-grid{grid-template-columns:1fr;gap:40px;}
  .about-media img{height:380px;}
  .service-grid{grid-template-columns:repeat(2,1fr);}
  .cat-grid{grid-template-columns:repeat(3,1fr);}
  .pillars{grid-template-columns:repeat(2,1fr);row-gap:36px;}
  .contact-grid{grid-template-columns:minmax(0,1fr);}
  .method-cards{grid-template-columns:minmax(0,1fr);}
  .moments{grid-template-columns:1fr 1fr;height:auto;}
  .moments figure{height:260px;}
  .moments figure:first-child{grid-column:1/-1;height:320px;}
  .accessories-note{grid-template-columns:1fr;text-align:center;}
  .footer-grid{grid-template-columns:1fr 1fr;row-gap:40px;}
  .arrangement-grid{grid-template-columns:repeat(2,1fr);}
}
/* Off-canvas nav collapses earlier than the content breakpoints below,
   since the horizontal menu + phone + CTA run out of room well before 720px. */
@media (max-width:1240px){
  .nav-shell{display:flex;align-items:stretch;padding:0;}
  .logo-panel{flex:1;padding:10px 20px 10px 12px;box-shadow:none;}
  .logo-panel img{height:32px;}
  header.scrolled .logo-panel img{height:28px;}
  .logo-panel .brand-text .name{font-size:1.08rem;}
  .logo-panel .brand-text .tag{font-size:.52rem;}
  .nav-stack{flex:0 0 auto;}
  .topbar{display:none;}
  .nav-main{padding:14px 18px;min-height:0;border-bottom-left-radius:0;}
  .nav-actions{display:none;}
  .hamburger{display:flex;}

  nav.main-nav{
    position:fixed;top:0;left:0;bottom:0;z-index:200;
    width:min(82vw,340px);background:var(--ivory);
    box-shadow:22px 0 42px rgba(11,4,82,.22);
    border-radius:0 24px 24px 0;
    transform:translateX(-100%);
    transition:transform .35s cubic-bezier(.2,.8,.2,1);
    padding:90px 22px 28px;overflow-y:auto;
  }
  nav.main-nav.active{transform:translateX(0);}

  .nav-menu-brand{
    display:flex;align-items:center;gap:10px;
    padding-bottom:18px;margin-bottom:10px;border-bottom:1px solid var(--line);
  }
  .nav-menu-brand img{height:30px;width:auto;}
  .nav-menu-brand .name{font-family:'EB Garamond',serif;font-weight:700;font-size:1.05rem;color:#7A1630;}
  .nav-menu-brand .tag{display:block;font-size:.56rem;letter-spacing:.16em;text-transform:uppercase;color:#7A1630;}

  nav.main-nav ul{flex-direction:column;align-items:stretch;gap:4px;}
  nav.main-nav a{
    color:var(--ink-soft)!important;display:flex;align-items:center;gap:14px;
    padding:13px 12px;font-size:.85rem;font-weight:500;border-radius:14px;
    transition:background-color .2s ease, color .2s ease;
  }
  nav.main-nav a::after{display:none;}
  nav.main-nav .nav-icon{
    display:inline-flex;align-items:center;justify-content:center;
    width:20px;height:20px;flex-shrink:0;color:var(--accent-soft);
  }
  nav.main-nav a:hover{background:var(--green-mist);color:var(--ink)!important;}
  nav.main-nav a.active{
    background:var(--accent);color:#fff!important;
    box-shadow:0 12px 24px -10px rgba(20,0,255,.5);
  }
  nav.main-nav a.active .nav-icon{color:#fff;}

  .nav-mobile-actions{
    display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:20px;
  }
  .nav-mobile-actions .btn{padding:12px 10px;font-size:.68rem;justify-content:center;}
}
@media (max-width:720px){
  section{padding:70px 0;}
  .stat{flex:1 1 50%;}
  .service-grid{grid-template-columns:1fr;}
  .cat-grid{grid-template-columns:repeat(2,1fr);}
  .arrangement-grid{grid-template-columns:1fr;}
  .pillars{grid-template-columns:1fr;}
  .cta-band .wrap{flex-direction:column;align-items:flex-start;}
  .topbar .wrap{justify-content:center;text-align:center;}
  .topbar-links{justify-content:center;}
  .footer-grid{grid-template-columns:1fr;}
  .footer-gallery{grid-template-columns:repeat(4,1fr);max-width:320px;}
  .strip-card{flex-basis:160px;}
  .strip-card .thumb{height:160px;}
  .back-to-top{right:14px;bottom:198px;width:40px;height:40px;}
  .social-float{right:14px;width:48px;height:48px;}
  .social-float svg{width:21px;height:21px;}
  .wa-float{bottom:26px;}
  .ig-float{bottom:84px;}
  .fb-float{bottom:142px;}
}

/* Touch screens: bigger tap targets for small text links */
@media (pointer:coarse){
  .footer-links-list li{margin-bottom:2px;}
  .footer-links-list a{display:inline-block;padding:8px 0;}
  .crumbs a{display:inline-block;padding:10px 0;}
  .contact-list .v a{padding:5px 0;}
}
/* Small phones: tighter contact labels */
@media (max-width:420px){
  .contact-list li{flex-direction:column;gap:6px;}
  .contact-list .k{width:auto;padding-top:0;}
}
