/* =========================================================================
   THE BOSTON ARTISTRY — /birthday-parties/ only (23 Sep 2026)
   Nandita's party page, 1:1 from her picture (board page 5 "Party Page",
   _site/copy/canva-round6/p5-party-page.png). Loaded after site.css and
   service.css by _site/build-round6b-pages.py. The paper-and-tape kit
   (.polaroid .tape .pnote .pillbtn .hand .hl) is in site.css, ROUND 6B.
   ========================================================================= */
.pt-hero{ padding-block:clamp(1rem,2.5vw,1.75rem) clamp(2rem,4vw,3rem); }
.pt-hero__wrap{ display:grid; grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr); gap:clamp(1.5rem,5vw,4rem); align-items:center; }
.pt-hero .crumb{ grid-column:1 / -1; margin-bottom:clamp(1rem,2vw,1.6rem); }
.pt-hero__h1{ margin:.2rem 0 .8rem; font-family:var(--display); font-weight:600; letter-spacing:-.02em; line-height:.98; font-size:clamp(2.4rem,1rem + 4.4vw,4.4rem); }
.pt-hero__h1 .u{ background:linear-gradient(transparent 68%, #FDE382 68%, #FDE382 92%, transparent 92%); }
.pt-hero__h1 svg{ width:.8em; height:.8em; vertical-align:-.1em; margin-left:.1em; }
.pt-hero__lead{ margin:0 0 .5rem; font-weight:700; font-size:clamp(1.05rem,.9rem + .7vw,1.4rem); }
.pt-hero__p{ margin:0; max-width:46ch; color:var(--ink-2); line-height:1.5; }
.pt-hero__facts{ display:flex; flex-wrap:wrap; gap:.6rem 1.4rem; margin:1.1rem 0 0; padding:0; list-style:none; font-size:.9rem; color:var(--ink-2); }
.pt-hero__facts li{ display:inline-flex; align-items:center; gap:.4rem; }
.pt-hero__facts svg{ width:1.15rem; height:1.15rem; }
.pt-hero__facts b{ color:var(--ink); }
.pt-hero__cta{ display:flex; flex-wrap:wrap; gap:.75rem; margin-top:1.3rem; }
.pt-hero__pics{ position:relative; min-height:380px; }
.pt-hero__pics .polaroid{ position:absolute; width:52%; }
.pt-hero__pics .polaroid:first-child{ left:0; top:6%; --tilt:-4deg; --ar:1; }
.pt-hero__pics .polaroid:nth-child(2){ right:0; top:0; --tilt:3deg; --ar:.85; width:50%; }
.pt-hero__pics .pnote{ right:2%; bottom:0; --tilt:-6deg; font-size:1.25rem; }
.pt-hero__pics .sticker{ right:-8px; top:44%; width:64px; height:64px; }
.pt-hero__pics .doodle{ position:absolute; right:-6px; top:8%; width:34px; }
@media (max-width:900px){
  .pt-hero__wrap{ grid-template-columns:1fr; }
  .pt-hero__pics{ min-height:0; height:clamp(260px,70vw,420px); order:-1; }
  .pt-hero .crumb{ order:-2; }
}

/* five ways to celebrate: five polaroid cards with tape */
.pt-ways__head{ display:grid; grid-template-columns:minmax(0,1fr) auto; gap:1rem 2rem; align-items:end; margin-bottom:clamp(1.5rem,3vw,2.2rem); }
.pt-ways__h{ margin:0; font-family:var(--display); font-weight:600; letter-spacing:-.02em; line-height:1; font-size:clamp(2rem,1rem + 3.4vw,3.6rem); }
.pt-ways__hand{ font-family:var(--hand); font-weight:700; font-size:1.2rem; line-height:1.05; text-transform:uppercase; max-width:18ch; transform:rotate(-3deg); }
.pt-ways{ list-style:none; margin:0; padding:0; display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:clamp(.8rem,1.6vw,1.3rem); }
.pt-way{ position:relative; display:flex; flex-direction:column; padding:10px 10px 12px; background:#fff; border-radius:3px;
  box-shadow:0 2px 0 rgba(0,0,0,.05), 0 18px 30px -18px rgba(20,17,10,.4); transform:rotate(var(--tilt,0deg)); }
.pt-way > .tape{ top:-11px; left:50%; transform:translateX(-50%) rotate(var(--tt,-3deg)); width:84px; height:22px; }
.pt-way img{ display:block; width:100%; aspect-ratio:1; object-fit:cover; }
.pt-way h3{ margin:.8rem 0 .15rem; font-family:var(--display); font-weight:600; font-size:1.1rem; letter-spacing:-.01em; }
.pt-way__price{ margin:0 0 .25rem; font-weight:700; font-size:.95rem; }
.pt-way__price small{ font-weight:500; color:var(--ink-2); }
.pt-way__d{ margin:0; font-size:.82rem; line-height:1.4; color:var(--ink-2); }
.pt-way__foot{ display:flex; align-items:center; justify-content:space-between; gap:.5rem; margin-top:auto; padding-top:.7rem; font-size:.8rem; color:var(--ink-2); }
.pt-way__foot span{ display:inline-flex; align-items:center; gap:.35rem; }
.pt-way__foot svg{ width:1rem; height:1rem; }
.pt-way__go{ width:36px; height:36px; border-radius:50%; display:grid; place-items:center; background:var(--ink); color:#fff; text-decoration:none; }
.pt-way__go svg{ width:16px; height:16px; }
.pt-way__go:hover{ background:var(--m); }
.pt-way .crown{ position:absolute; top:-22px; right:12px; width:28px; }
.pt-way .smile{ left:-24px; bottom:-18px; width:52px; height:52px; }
.pt-ways__not{ display:grid; grid-template-columns:auto minmax(0,1fr) auto; gap:1rem 1.5rem; align-items:center; margin-top:clamp(1.6rem,3vw,2.4rem); }
.pt-ways__not .hl{ font-family:var(--hand); font-weight:700; font-size:clamp(1.3rem,1rem + 1vw,1.8rem); padding:.15rem .8rem; --hlc:#FBC3D6; display:inline-block; transform:rotate(-2deg); }
.pt-ways__not p{ margin:0; font-size:.9rem; line-height:1.45; color:var(--ink-2); max-width:44ch; }
.pt-ways__not .doodle{ width:34px; }
@media (max-width:1100px){ .pt-ways{ grid-template-columns:repeat(3,minmax(0,1fr)); } }
@media (max-width:700px){ .pt-ways{ grid-template-columns:repeat(2,minmax(0,1fr)); } .pt-ways__head{ grid-template-columns:1fr; } .pt-ways__not{ grid-template-columns:1fr; } }
@media (max-width:420px){ .pt-ways{ grid-template-columns:1fr; } }

/* how it works: five steps in a row */
.pt-how__head{ display:grid; grid-template-columns:minmax(0,1fr) auto; gap:1rem 2rem; align-items:end; margin-bottom:clamp(1.4rem,3vw,2rem); }
.pt-how__h{ margin:0; font-family:var(--display); font-weight:600; letter-spacing:-.02em; line-height:1.05; font-size:clamp(1.7rem,1rem + 2.6vw,3rem); }
.pt-how__h .u{ background:linear-gradient(transparent 68%, #FDE382 68%, #FDE382 92%, transparent 92%); }
.pt-steps{ list-style:none; margin:0; padding:0; display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:0; }
.pt-step{ padding:0 1.1rem 0 0; margin-right:1.1rem; border-right:1px solid var(--line); }
.pt-step:last-child{ border-right:0; margin-right:0; padding-right:0; }
.pt-step svg{ width:34px; height:34px; color:#FF6FAE; }
.pt-step h3{ margin:.6rem 0 .3rem; font-family:var(--body); font-size:.72rem; font-weight:800; letter-spacing:.14em; text-transform:uppercase; }
.pt-step h3 i{ font-style:normal; color:#FF6FAE; margin-right:.35rem; }
.pt-step p{ margin:0; font-size:.84rem; line-height:1.45; color:var(--ink-2); }
@media (max-width:900px){ .pt-steps{ grid-template-columns:repeat(2,minmax(0,1fr)); gap:1.2rem 0; } .pt-step:nth-child(2n){ border-right:0; } .pt-how__head{ grid-template-columns:1fr; } }
@media (max-width:480px){ .pt-steps{ grid-template-columns:1fr; } .pt-step{ border-right:0; padding-right:0; margin-right:0; } }

/* party moments: six polaroids scattered */
.pt-moments__h{ margin:0 0 clamp(1.4rem,3vw,2rem); font-family:var(--display); font-weight:600; letter-spacing:-.02em; line-height:1.05; font-size:clamp(1.8rem,1rem + 2.6vw,3rem); }
.pt-moments{ position:relative; display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:clamp(.6rem,1.4vw,1.2rem); align-items:start; padding-bottom:2.4rem; }
.pt-moments .polaroid{ --ar:1; }
.pt-moments .polaroid:nth-child(odd){ --tilt:-3deg; margin-top:1.4rem; }
.pt-moments .polaroid:nth-child(even){ --tilt:2.5deg; }
.pt-moments .pnote{ font-size:1rem; }
.pt-moments .n1{ left:-1%; bottom:-.2rem; --tilt:-5deg; }
.pt-moments .n2{ left:46%; bottom:.2rem; --tilt:3deg; }
.pt-moments .n3{ right:14%; top:-1.2rem; --tilt:-4deg; }
.pt-moments .sticker{ right:10%; bottom:-.4rem; width:48px; height:48px; }
@media (max-width:900px){ .pt-moments{ grid-template-columns:repeat(3,minmax(0,1fr)); } .pt-moments .n3{ display:none; } }
@media (max-width:480px){ .pt-moments{ grid-template-columns:repeat(2,minmax(0,1fr)); } .pt-moments .n2{ display:none; } }

/* what parents say: three quote cards (real Google reviews) */
.pt-say{ list-style:none; margin:0; padding:0; display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:clamp(.8rem,1.6vw,1.3rem); }
.pt-say li{ position:relative; padding:1.4rem 1.4rem 1.2rem; background:#fff; border-radius:8px; box-shadow:0 14px 30px -22px rgba(20,17,10,.5); }
.pt-say blockquote{ margin:0; font-family:var(--display); font-weight:500; font-size:1.02rem; line-height:1.45; }
.pt-say figcaption{ margin:.9rem 0 0; font-size:.8rem; font-weight:700; color:var(--ink-2); }
.pt-say .doodle{ position:absolute; right:1rem; bottom:.9rem; width:26px; }
@media (max-width:800px){ .pt-say{ grid-template-columns:1fr; } }

/* the last band: pink gingham, "Ready to plan something amazing?" */
.pt-cta{ position:relative; margin-top:clamp(2rem,5vw,4rem); padding:clamp(1.6rem,3.5vw,2.6rem) 0; overflow:hidden; }
.pt-cta__in{ display:grid; grid-template-columns:auto minmax(0,1fr) auto; gap:1.2rem 1.6rem; align-items:center; }
.pt-cta__in .sticker{ position:static; width:64px; height:64px; }
.pt-cta__h{ margin:0 0 .2rem; font-family:var(--display); font-weight:600; letter-spacing:-.02em; line-height:1.05; font-size:clamp(1.5rem,1rem + 2vw,2.4rem); }
.pt-cta__p{ margin:0; font-size:.95rem; color:var(--ink-2); }
.pt-cta .pnote{ right:2%; top:12%; --tilt:6deg; font-size:1rem; }
@media (max-width:760px){ .pt-cta__in{ grid-template-columns:1fr; text-align:center; justify-items:center; } .pt-cta .pnote{ display:none; } }

/* the section eyebrow dot colours of her page */
.pt .dot-eyebrow{ --dot:#FF6FAE; }
.pt .dot-eyebrow.y{ --dot:#F8C72F; }

/* --- round 7 (23 Sep 2026 night, Nandita: "need sliding pics"): each card's picture slides sideways through its photos,
   about 4 s a photo, the five cards out of step; hover pauses it; reduced motion shows the first photo only. ------------ */
.pt-slides{ position:relative; overflow:hidden; aspect-ratio:1; }
.pt-slides__track{ display:flex; width:calc(var(--n) * 100%); height:100%; animation:ptSlide2 9s var(--delay,0s) infinite cubic-bezier(.65,0,.35,1); }
.pt-slides__track--3{ animation-name:ptSlide3; animation-duration:13s; }
.pt-slides__track img{ flex:0 0 calc(100% / var(--n)); width:calc(100% / var(--n)); height:100%; aspect-ratio:auto; object-fit:cover; }
.pt-way:hover .pt-slides__track{ animation-play-state:paused; }
.pt-slides__dots{ position:absolute; left:0; right:0; bottom:8px; display:flex; justify-content:center; gap:5px; }
.pt-slides__dots i{ width:6px; height:6px; border-radius:50%; background:rgba(255,255,255,.75); box-shadow:0 0 0 1px rgba(20,20,24,.15); }
@keyframes ptSlide2{ 0%,42%{ transform:translateX(0); } 50%,92%{ transform:translateX(-50%); } 100%{ transform:translateX(0); } }
@keyframes ptSlide3{ 0%,26%{ transform:translateX(0); } 33%,59%{ transform:translateX(-33.333%); } 66%,92%{ transform:translateX(-66.666%); } 100%{ transform:translateX(0); } }
@media (prefers-reduced-motion: reduce){ .pt-slides__track{ animation:none; } .pt-slides__dots{ display:none; } }
/* the heart after "get to design." sat on its own line (site.css makes every svg a block): inline, like her picture */
.pt-hero__h1 svg{ display:inline-block; vertical-align:-.06em; }
