.weddingPage{
  background:
    radial-gradient(circle at 12% 10%, rgba(226,190,166,.22), transparent 26%),
    radial-gradient(circle at 90% 14%, rgba(255,204,180,.18), transparent 24%),
    #fffdfb;
}

.weddingPage .hero{
  padding:72px 0 62px;
  background:
    radial-gradient(circle at 68% 18%, rgba(226,190,166,.18), transparent 28%),
    radial-gradient(circle at 94% 40%, rgba(255,116,62,.08), transparent 24%),
    linear-gradient(180deg,#fffdfb 0%,#fffaf6 100%);
}

.weddingPage .heroGrid{
  grid-template-columns:minmax(420px,.84fr) minmax(520px,1.16fr);
  gap:74px;
}

.weddingPage .hero h1{
  max-width:560px;
  font-size:clamp(62px, 6.6vw, 88px);
}

.weddingHeroVisual{
  position:relative;
  min-height:470px;
  display:grid;
  place-items:center;
}

.weddingStack{
  position:relative;
  width:min(100%, 520px);
  height:390px;
}

.weddingStack:before{
  content:"";
  position:absolute;
  left:50%;
  bottom:0;
  width:430px;
  height:90px;
  transform:translateX(-50%);
  border-radius:50%;
  background:rgba(64,42,30,.16);
  filter:blur(28px);
}

.weddingPreviewCard{
  position:absolute;
  top:0;
  left:50%;
  width:300px;
  height:390px;
  border-radius:18px;
  overflow:hidden;
  background:#f7efe8;
  border:1px solid rgba(255,255,255,.72);
  box-shadow:0 26px 65px rgba(45,29,20,.2);
  transform-origin:center bottom;
}

.weddingPreviewCard img,
.weddingPreviewCard video{
  width:100%;
  height:100%;
  display:block;
  object-fit:cover;
}

.weddingPreviewCard.sideLeft{
  transform:translateX(-86%) rotate(-9deg) scale(.86);
  opacity:.72;
  filter:saturate(.86) brightness(1.05);
}

.weddingPreviewCard.sideRight{
  transform:translateX(-14%) rotate(8deg) scale(.86);
  opacity:.62;
  filter:saturate(.82) brightness(1.08);
}

.weddingPreviewCard.main{
  z-index:3;
  transform:translateX(-50%) rotate(.4deg);
  cursor:pointer;
}

.weddingPreviewCard.main:after{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(180deg,rgba(16,13,18,.02) 34%,rgba(16,13,18,.43) 100%);
  pointer-events:none;
}

.weddingPreviewCard.main video{
  position:absolute;
  inset:0;
  opacity:0;
  transition:opacity .2s ease;
}

.weddingPreviewCard.main.isPlaying video{opacity:1}
.weddingPreviewCard.main.isPlaying img{opacity:0}

.weddingPlay{
  position:absolute;
  left:50%;
  top:52%;
  z-index:4;
  width:72px;
  height:72px;
  display:grid;
  place-items:center;
  padding-left:5px;
  border-radius:50%;
  border:2px solid rgba(255,255,255,.9);
  color:#fff;
  background:rgba(255,255,255,.14);
  box-shadow:0 16px 32px rgba(30,20,15,.24);
  transform:translate(-50%,-50%);
}

.weddingPreviewCard.main.isPlaying .weddingPlay{opacity:0}

.weddingCardCopy{
  position:absolute;
  left:24px;
  right:24px;
  bottom:24px;
  z-index:4;
  color:#fffaf5;
  text-align:center;
  text-shadow:0 2px 18px rgba(0,0,0,.28);
}

.weddingCardCopy strong{
  display:block;
  margin-bottom:8px;
  font-family:var(--serif);
  font-size:31px;
  line-height:1;
  font-weight:400;
  letter-spacing:.04em;
}

.weddingCardCopy span{
  display:block;
  font-size:11px;
  letter-spacing:.18em;
  font-weight:800;
}

.weddingScript{
  position:absolute;
  right:0;
  top:112px;
  width:128px;
  color:#332b36;
  font-family:var(--serif);
  font-size:23px;
  font-style:italic;
  line-height:1.12;
  text-align:center;
  transform:rotate(-5deg);
}

.weddingScript span{
  display:block;
  margin-top:12px;
  color:var(--orange);
  font-family:var(--sans);
}

.weddingMiniGrid{
  display:grid;
  grid-template-columns:repeat(3, minmax(0,1fr));
  gap:16px;
  width:min(100%, 520px);
  margin:18px auto 0;
}

.weddingMini{
  display:block;
  padding:10px;
  border:1px solid rgba(45,32,26,.08);
  border-radius:16px;
  background:rgba(255,255,255,.78);
  box-shadow:0 16px 35px rgba(58,37,24,.08);
  text-align:center;
  text-decoration:none;
  transition:transform .18s ease, box-shadow .18s ease;
}

.weddingMini:hover{transform:translateY(-3px);box-shadow:0 20px 40px rgba(58,37,24,.12)}

.weddingMini img{
  width:100%;
  aspect-ratio:1.45/1;
  display:block;
  object-fit:cover;
  border-radius:11px;
}

.weddingMini span{
  display:block;
  padding:10px 4px 3px;
  font-size:13px;
  font-weight:800;
}

.weddingTemplates{
  padding-top:76px;
}

.weddingPage .sectionHeader{
  margin-bottom:24px;
}

.sectionSubcopy{
  max-width:590px;
  margin:14px 0 0;
  color:#615a63;
  font-size:16px;
  line-height:1.55;
}

.weddingPage .templateGrid{
  grid-template-columns:repeat(6,minmax(0,1fr));
  gap:20px;
}

.weddingPage .templateCard{
  border-radius:16px;
  background:#fff;
}

.weddingPage .templateImage{
  aspect-ratio:1.13/1;
}

.weddingPage .templateCard.isPortraitTemplate .templateImage{
  aspect-ratio:2/3;
}

.weddingPage .templateImage:after,
.typeImage:after,
.inspirationImage:after{
  content:none;
  position:absolute;
  left:50%;
  top:50%;
  width:50px;
  height:50px;
  display:grid;
  place-items:center;
  padding-left:4px;
  border:2px solid rgba(255,255,255,.9);
  border-radius:50%;
  background:rgba(255,255,255,.14);
  color:white;
  box-shadow:0 13px 26px rgba(24,15,11,.17);
  transform:translate(-50%,-50%);
}

.weddingPage .cardBody{
  padding:14px 14px 16px;
}

.weddingPage .cardBody h3{
  font-size:14px;
}

.cardAction{
  display:inline-block;
  margin-top:12px;
  color:var(--orange);
  font-size:12px;
  font-weight:900;
}

.typeImage .previewButton,
.inspirationImage .previewButton{
  width:46px;
  height:46px;
}

.typeActions{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  margin-top:13px;
}

.typeActions .templateAction{
  min-height:26px;
}

.weddingTypes{
  padding:68px 0 76px;
  background:linear-gradient(180deg,#fffaf6,#fffdfb);
}

.splitHeader{
  display:grid;
  grid-template-columns:minmax(0,.58fr) minmax(260px,.42fr);
  gap:56px;
  align-items:end;
  margin-bottom:28px;
}

.splitHeader p{
  margin:0;
  color:#544d58;
  font-size:16px;
  line-height:1.6;
}

.typeGrid{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:22px;
}

.typeCard,.inspirationCard{
  display:block;
  overflow:hidden;
  border:1px solid rgba(45,32,26,.08);
  border-radius:16px;
  background:#fff;
  box-shadow:0 14px 32px rgba(58,37,24,.07);
  text-decoration:none;
  transition:transform .18s ease, box-shadow .18s ease;
}

.typeCard:hover,.inspirationCard:hover{
  transform:translateY(-4px);
  box-shadow:0 22px 44px rgba(58,37,24,.12);
}

.typeImage,.inspirationImage{
  position:relative;
  aspect-ratio:1.95/1;
  overflow:hidden;
}

.typeImage img,.inspirationImage img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}

.typeBody{
  position:relative;
  padding:15px 44px 17px 15px;
}

.typeBody h3,.inspirationCard h3{
  margin:0 0 5px;
  font-size:15px;
}

.typeBody p{
  margin:0;
  color:#615a63;
  font-size:13px;
}

.plusBadge{
  position:absolute;
  right:14px;
  bottom:16px;
  width:24px;
  height:24px;
  display:grid;
  place-items:center;
  border:1px solid rgba(255,90,34,.32);
  border-radius:50%;
  color:var(--orange);
  font-weight:900;
}

.inspiration{
  padding:66px 0;
  background:#fffdfb;
}

.inspirationGrid{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:22px;
}

.inspirationImage{
  aspect-ratio:1.86/1;
}

.inspirationCard h3{
  padding:15px 15px 17px;
}

.weddingFaq{
  background:#fffdfb;
  padding:54px 0 70px;
  border-top:0;
}

.weddingFaq .faqGrid{
  grid-template-columns:minmax(240px,.28fr) minmax(0,.72fr);
}

.accordionList{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:0 42px;
}

.accordionItem{
  border-bottom:1px solid rgba(45,32,26,.13);
}

.accordionItem summary{
  list-style:none;
  cursor:pointer;
  min-height:52px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:18px;
  color:#201d31;
  font-size:14px;
  font-weight:900;
}

.accordionItem summary::-webkit-details-marker{display:none}

.accordionItem summary:after{
  content:"+";
  color:#201d31;
  font-size:20px;
  font-weight:500;
}

.accordionItem[open] summary:after{content:"−"}

.accordionItem p{
  margin:0 0 18px;
  color:#625b66;
  font-size:14px;
  line-height:1.6;
}

.weddingFinal{
  min-height:360px;
  display:grid;
  align-items:center;
  background:
    linear-gradient(90deg,rgba(30,23,22,.24),rgba(30,23,22,.04) 50%,rgba(30,23,22,.2)),
    url("/assets/templates/covers/Lake_Como_Wedding_FINAL.jpg") center 38%/cover no-repeat;
}

.weddingFinal .ctaInner{
  grid-template-columns:minmax(0,.62fr) minmax(260px,.38fr);
}

.weddingFinal h2{
  max-width:560px;
}

.weddingFinal .scriptNote{
  justify-self:end;
  max-width:190px;
  color:#fff8f2;
  font-family:var(--serif);
  font-size:25px;
  font-style:italic;
  line-height:1.16;
  text-align:center;
  text-shadow:0 2px 18px rgba(0,0,0,.22);
}

.weddingFinal .scriptNote span{
  display:block;
  color:#ffb78e;
  font-family:var(--sans);
  font-size:22px;
  margin-top:12px;
}

@media(max-width:1080px){
  .weddingPage .heroGrid{grid-template-columns:1fr;gap:34px}
  .weddingPage .heroCopy{text-align:center}
  .weddingPage .hero h1,.weddingPage .heroText{margin-left:auto;margin-right:auto}
  .weddingPage .benefitRow{margin-left:auto;margin-right:auto}
  .weddingPage .heroButtons,.weddingPage .socialProof{justify-content:center}
  .weddingScript{right:20px}
  .weddingPage .templateGrid{grid-template-columns:repeat(3,minmax(0,1fr))}
  .splitHeader{grid-template-columns:1fr;gap:18px}
  .typeGrid,.inspirationGrid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .weddingFaq .faqGrid{grid-template-columns:1fr;gap:28px}
}

@media(max-width:760px){
  .weddingPage .hero{padding-top:50px}
  .weddingPage .hero h1{font-size:55px}
  .weddingHeroVisual{min-height:auto}
  .weddingStack{width:min(100%,360px);height:336px}
  .weddingPreviewCard{width:236px;height:318px}
  .weddingPreviewCard.sideLeft{transform:translateX(-78%) rotate(-8deg) scale(.82)}
  .weddingPreviewCard.sideRight{transform:translateX(-22%) rotate(8deg) scale(.82)}
  .weddingScript{display:none}
  .weddingMiniGrid{grid-template-columns:1fr;gap:12px;width:min(100%,360px)}
  .weddingMini{display:grid;grid-template-columns:112px 1fr;align-items:center;text-align:left}
  .weddingMini img{aspect-ratio:1.6/1}
  .weddingMini span{padding:0 8px;font-size:14px}
  .weddingPage .templateGrid{grid-template-columns:1fr 1fr}
  .typeGrid,.inspirationGrid{grid-template-columns:1fr}
  .accordionList{grid-template-columns:1fr}
  .weddingFinal .ctaInner{grid-template-columns:1fr}
  .weddingFinal .scriptNote{justify-self:start;text-align:left}
}

@media(max-width:460px){
  .weddingPage .hero h1{font-size:47px}
  .weddingStack{height:310px}
  .weddingPreviewCard{width:218px;height:294px}
  .weddingPlay{width:60px;height:60px}
  .weddingCardCopy strong{font-size:25px}
  .weddingPage .templateGrid{grid-template-columns:1fr}
}