/* ─────────────────────────────────────────────
   Wisherly — calm finish for the marketing pages.
   Loaded last on the homepage, Wishes/Invitations pages, the blog and About.
   Flat colour instead of gradients and glow orbs, hairline borders instead of
   heavy shadows, no hover lifts or bouncing arrows, no coloured side stripes,
   no looping decoration. The logo, the pink brand and the glass bands stay.
───────────────────────────────────────────────── */
:root{
  --shadow-card:0 1px 2px rgba(13,18,22,.05);
  --shadow-lift:0 1px 2px rgba(13,18,22,.06);
}

/* ── no glow orbs, no gradient fills ── */
.cx-hero::before{display:none!important;}
.cx-card.soon .cx-tile,.tw-vis.soon{background:var(--brand-tint-2,#FEF5F9)!important;}
.tw-look img{background:#fff!important;}

/* homepage pastel blocks → one flat tint each */
.g-purple,.g-pink,.g-yellow,.g-green,.g-blue,.g-peach,.g-coral,.pg-cover,.pic.a,.pic.b,.pic.c,.story-feat{background:var(--brand-tint,#FBE9F1)!important;}
.hcard1::after,.hcard2::after,.hcard3::after,.hcard4::after,.hcard5::after{background-color:var(--brand-tint,#FBE9F1)!important;}
.pg-wish .av{background:var(--brand-surface,#F2AECB)!important;}
.promo.p1,.promo.p2,.cta-card{background-image:none!important;}

/* ── quiet surfaces: a hairline instead of a floating shadow ── */
.cx-card,.tw,.bl-card,.fq-card,.cx-step,.tw-cmp-wrap,.occ,.sec-card,.story-card,.eo-card,.hiw-card,.tw-look{box-shadow:none!important;}
.cx-card,.bl-card,.fq-card,.tw,.tw-look{border:1px solid var(--line,#E9EBEF);}
.tw-top{border:2px solid var(--brand,#D4225F)!important;box-shadow:none!important;}
.cx-float{box-shadow:0 1px 3px rgba(13,18,22,.08)!important;}

/* ── no hover lifts, zooms or bouncing arrows ── */
.cx-card:hover,.cx-step:hover,.bl-card:hover,.tw-look:hover,.occ:hover,.btn-p:hover,.btn:hover,.cx-btn:hover,.cx-visual:hover .cx-float,.sec-card:hover,.story-card:hover,.eo-card:hover,.hiw-card:hover{transform:none!important;box-shadow:none!important;}
.cx-card:hover .cx-poster img,.tw:hover .tw-vis img,.bl-card:hover .bl-card-img img,.cx-live-sm:hover .cx-tile-img img{transform:none!important;}
.ar,.cx-btn .ar,.btn .ar{transition:none!important;transform:none!important;animation:none!important;}
.cx-float{transform:none!important;}

/* ── "How it works": soft grey tiles (Apple-style), plus a Mighty Moo tile ──
   Self-contained so it also works on the homepage, which doesn't load catalogue.css. */
.cx-steps{display:grid!important;grid-template-columns:repeat(4,minmax(0,1fr))!important;gap:16px!important;margin-top:42px;align-items:stretch;}
.cx-step{position:relative;display:flex;flex-direction:column;align-items:flex-start;text-align:left;height:100%;
  background:#F5F5F7!important;border:0!important;border-radius:28px!important;padding:32px 28px 34px!important;box-shadow:none!important;overflow:hidden;}
.cx-ring{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;width:56px;height:56px;border:0!important;border-radius:50%;background:#fff!important;margin:0 0 56px!important;transform:none!important;}
.cx-ring svg{width:28px;height:28px;color:var(--brand,#D4225F);display:block;}
.cx-step-n{display:block;margin:0 0 8px!important;font-size:12px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--muted,#5E636B)!important;}
.cx-step h3{font-size:clamp(20px,1.7vw,23px);font-weight:800;letter-spacing:-.025em;line-height:1.2;color:var(--ink,#0D1216);margin:0 0 10px;}
.cx-step p{font-size:15px;line-height:1.6;color:var(--muted,#5E636B);margin:0;}
.cx-moo{background:var(--brand-tint-2,#FEF5F9)!important;}
.cx-moo-img{height:100px;width:auto;margin:-2px 0 14px -6px;display:block;pointer-events:none;user-select:none;}
.cx-moo .cx-step-n{color:var(--brand-press,#A8184B)!important;}
.cx-moo-btn{text-decoration:none;margin-top:auto;padding-top:18px!important;padding:0;border:0;background:none;font:inherit;font-size:15px;font-weight:700;color:var(--brand-press,#A8184B);cursor:pointer;}
.cx-moo-btn:hover{text-decoration:underline;text-underline-offset:3px;}
@media(max-width:1100px){.cx-steps{grid-template-columns:repeat(2,minmax(0,1fr))!important;}.cx-step{min-height:0;}}
@media(max-width:640px){.cx-steps{grid-template-columns:1fr!important;gap:12px!important;}.cx-step{min-height:0;border-radius:24px!important;padding:26px 22px 28px!important;}.cx-ring{margin-bottom:28px!important;}.cx-moo-img{height:76px;margin-bottom:10px;}}

/* ── no coloured side stripes ── */
.hiw-card::before{display:none!important;}
.bl-prose blockquote{border-left:0!important;border-radius:12px!important;background:var(--surface-3,#FAFBFC)!important;border:1px solid var(--line,#E9EBEF)!important;}

/* ── no looping decoration ── */
.tw-anim svg,.tw-anim i,.cx-ic *,.cx-ic{animation:none!important;}
.ic-tick{stroke-dasharray:none!important;}
.tw-anim i{display:none;}

/* ── homepage panels: flat, no floating shadow ── */
.promo,.cta-card,.cx-band-in,.stats-grid,.wf-stats{box-shadow:none!important;}
.promo:hover,.cta-card:hover{transform:none!important;box-shadow:none!important;}

/* ── readable small text (WCAG AA contrast) ── */
.cx-tag.soon,.bl-tag,.tw-soon,.bl-cta-eb,.fq-label{color:var(--brand-press,#A8184B)!important;}
.cx-tag{color:#4F545C;}
.stat-l,.wf-stat-l,.hiw-step-desc{color:#5E636B!important;}
.cx-btn.pri,.btn-p,.wly-btn{background:var(--brand-deep,#C41D56);}
:focus-visible{outline:2px solid var(--brand,#D4225F);outline-offset:2px;}

/* ── Theme cards: one full image on top, details below.
   A theme made for her and for him flips between the two with the For Him / For Her switch. ── */
.cx-card.th{grid-column:auto;display:flex!important;flex-direction:column;border-radius:20px!important;}
.cx-card.th.wide{grid-column:span 2;}
.cx-card.th:hover{transform:none!important;}
.th-media{position:relative;aspect-ratio:16/9;background:#F5F5F7;perspective:1800px;overflow:hidden;}
.th-flip{position:absolute;inset:0;transform-style:preserve-3d;transition:transform .7s cubic-bezier(.2,.8,.2,1);}
.is-flip .th-flip{transform:rotateY(180deg);}
.th-face{position:absolute;inset:0;display:block;backface-visibility:hidden;-webkit-backface-visibility:hidden;}
.th-face img{width:100%;height:100%;object-fit:cover;object-position:center 30%;display:block;transform:none!important;}
.th-back{transform:rotateY(180deg);}
.th-demo{position:absolute;left:14px;top:14px;z-index:2;display:inline-flex;align-items:center;gap:8px;height:34px;padding:0 14px;border-radius:4px;
  background:rgba(255,255,255,.94);color:var(--ink,#0D1216);font-size:13px;font-weight:700;text-decoration:none;}
.th-demo:hover{background:#fff;}
.th-switch{display:inline-flex;align-self:flex-start;gap:2px;margin:18px 24px 0;padding:4px;border-radius:4px;background:#F5F5F7;}
.th-switch button{border:0;background:transparent;border-radius:3px;padding:8px 18px;font:inherit;font-size:14px;font-weight:600;color:var(--muted,#5E636B);cursor:pointer;transition:background .2s,color .2s,box-shadow .2s;}
.th-switch button[aria-pressed="true"]{background:#fff;color:var(--ink,#0D1216);box-shadow:0 1px 3px rgba(13,18,22,.14);}
.th-switch.on-img{position:absolute;left:12px;bottom:12px;z-index:2;margin:0;background:rgba(255,255,255,.88);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);}
.th-switch.on-img button{padding:6px 14px;font-size:13px;}
.cx-card.th .cx-body{padding:18px 24px 26px;}
.cx-card.th h3{margin-top:12px;}
.cx-card.th.wide .cx-feats{grid-template-columns:repeat(2,minmax(0,1fr));}
.cx-card.th .cx-feats{grid-template-columns:1fr;}
.tw-vis.th-tw{aspect-ratio:16/9;}
.tw-vis.th-tw .th-media{position:absolute;inset:0;aspect-ratio:auto;}
.tw-vis.th-tw .play{z-index:3;text-decoration:none;}
@media(prefers-reduced-motion:reduce){.th-flip{transition:none;}}
@media(max-width:980px){.cx-card.th.wide{grid-column:span 2;}}
@media(max-width:640px){.cx-card.th.wide{grid-column:auto;}.cx-card.th.wide .cx-feats{grid-template-columns:1fr;}.th-switch{margin:16px 18px 0;}.cx-card.th .cx-body{padding:16px 18px 22px;}}

/* ── Occasion pages (Apple-style): a centred hero, then every product full width ── */
.ap-hero{padding:64px 0 8px;text-align:center;}
.ap-hero-t{max-width:820px;margin:0 auto;}
.ap-hero h1{font-size:clamp(40px,6.4vw,80px);line-height:1.02;letter-spacing:-.045em;font-weight:800;color:var(--ink,#0D1216);margin:0;}
.ap-hero h1 em{font-style:normal;color:var(--brand,#D4225F);}
.ap-hero .cx-lede{margin:22px auto 0;max-width:620px;font-size:clamp(17px,1.7vw,21px);}
.ap-hero .cx-ctas{justify-content:center;margin-top:30px;}
.ap-hero .cx-btn svg{margin-right:2px;}
.ap-hero-img{margin:52px auto 0;border-radius:28px;overflow:hidden;aspect-ratio:21/9;background:#F5F5F7;}
.ap-hero-img img{width:100%;height:100%;object-fit:cover;object-position:center 35%;display:block;}
.ap-designs{padding-top:72px;}
.cx-card.th.full{grid-column:1/-1;}
.cx-card.th.full .th-media{aspect-ratio:21/9;}
.cx-card.th.full .cx-body{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:12px 48px;padding:24px 32px 32px;}
.cx-card.th.full .cx-feats{grid-template-columns:1fr;margin-top:6px;}
.cx-card.th.full h3{font-size:clamp(28px,3vw,38px);}
.cx-card.th.full .th-switch{margin:20px 32px 0;}
.th-more{display:flex;flex-direction:column;min-width:0;}
.cx-card.th:not(.full) .th-more{flex:1;}
.cx-card.th .cx-body{flex:1;}
.ap-note{display:flex;align-items:center;gap:12px;margin:20px 0 0;padding:14px 18px;border:1px solid var(--line,#E9EBEF);border-radius:12px;background:var(--surface-3,#FAFBFC);font-size:14.5px;line-height:1.5;color:var(--muted,#5E636B);}
.ap-note svg{flex-shrink:0;color:var(--brand,#D4225F);}
.ap-note b{color:var(--ink,#0D1216);font-weight:700;}
.cx-grid + .cx-grid{margin-top:20px;}
@media(max-width:860px){.cx-card.th.full .cx-body{grid-template-columns:1fr;padding:20px 20px 24px;}.cx-card.th.full .th-media,.ap-hero-img{aspect-ratio:16/10;}.cx-card.th.full .th-switch{margin:16px 20px 0;}}
@media(max-width:640px){.ap-hero{padding-top:36px;}.ap-hero-img{margin-top:32px;border-radius:20px;}.ap-designs{padding-top:44px;}}
.cx-card.th.full .th-face img{object-position:center 8%;}
.cx-card.th.full .cx-buy .cx-price{flex-basis:100%;}

/* ── Occasion pages, Apple-style: a full-width picture hero with the words on it ── */
.ah{position:relative;margin:12px 12px 0;height:clamp(520px,82vh,880px);overflow:hidden;background:#1a1416;isolation:isolate;}
.ah-media,.ah-media img{position:absolute;inset:0;width:100%;height:100%;display:block;}
.ah-media img{object-fit:cover;}
.ah::after{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;}
.ah-dark::after{background:linear-gradient(to top,rgba(14,8,10,.62) 0%,rgba(14,8,10,.18) 42%,transparent 62%),linear-gradient(to right,rgba(14,8,10,.38) 0%,transparent 55%);}
.ah-light::after{background:linear-gradient(to right,rgba(255,255,255,.92) 0%,rgba(255,255,255,.6) 38%,transparent 64%);}
.ah-in{position:absolute;z-index:2;left:clamp(24px,5.5vw,88px);bottom:clamp(32px,7vh,76px);max-width:640px;}
.ah h1{margin:0;font-size:clamp(38px,4.6vw,64px);line-height:1.04;letter-spacing:-.04em;font-weight:800;max-width:12ch;}
.ah p{margin:18px 0 0;font-size:clamp(17px,1.6vw,21px);line-height:1.5;max-width:520px;}
.ah-ctas{display:flex;flex-wrap:wrap;align-items:center;gap:22px;margin-top:28px;}
.ah-btn{display:inline-flex;align-items:center;height:54px;padding:0 28px;border-radius:4px;font-size:17px;font-weight:700;text-decoration:none;}
.ah-ghost{display:inline-flex;align-items:center;gap:8px;font-size:17px;font-weight:700;text-decoration:none;}
.ah-ghost svg{width:12px;height:12px;}
.ah-dark h1,.ah-dark p,.ah-dark .ah-ghost{color:#fff;}
.ah-dark p{color:rgba(255,255,255,.88);}
.ah-dark .ah-btn{background:#fff;color:var(--ink,#0D1216);}
.ah-light h1,.ah-light .ah-ghost{color:var(--ink,#0D1216);}
.ah-light p{color:var(--text,#3F434B);}
.ah-light .ah-btn{background:var(--brand-deep,#C41D56);color:#fff;}
.ah-btn:hover{opacity:.92;}

/* ── The designs, Apple-style: words on top, the picture fills the bottom, three to a row ── */
.al{background:#F5F5F7;padding:72px 0 88px;margin-top:12px;}
.al-h{margin:0 0 32px;font-size:clamp(26px,2.6vw,38px);line-height:1.12;letter-spacing:-.03em;font-weight:800;color:var(--ink,#0D1216);}
.al-h span{color:#86868B;}
.al-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px;align-items:stretch;}
.ac{position:relative;display:flex;flex-direction:column;min-height:640px;background:#fff;border-radius:28px;overflow:hidden;}
.ac-top{padding:36px 34px 22px;}
.ac-eb{display:block;font-size:13px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:var(--brand-press,#A8184B);}
.ac h3{margin:8px 0 0;font-size:clamp(26px,2.3vw,32px);line-height:1.1;letter-spacing:-.03em;font-weight:800;color:var(--ink,#0D1216);}
.ac-ds{margin:12px 0 0;font-size:16px;line-height:1.5;color:var(--text,#3F434B);}
.ac-pr{margin:12px 0 0;font-size:16px;font-weight:700;color:var(--ink,#0D1216);}
.ac-pr span{font-size:14px;font-weight:500;color:var(--muted,#5E636B);}
.ac-ctas{display:flex;flex-wrap:wrap;align-items:center;gap:18px;margin-top:12px;}
.ac-link{display:inline-flex;align-items:center;min-height:44px;font-size:15px;font-weight:700;color:var(--brand-press,#A8184B);text-decoration:none;}
.ac-link:hover{text-decoration:underline;text-underline-offset:3px;}
.ac .th-switch{margin:20px 0 0;}
.ac-media.th-media{flex:1;min-height:260px;aspect-ratio:auto;margin-top:auto;background:#F5F5F7;}
.ac-media .th-face img{object-position:center 22%;}
.ac-media.th-media{background:#EFEFF2;}
.al .ap-note{background:#fff;border-color:transparent;margin-top:24px;}
@media(max-width:1060px){.al-grid{grid-template-columns:repeat(2,minmax(0,1fr));}}
@media(max-width:680px){
  .ah{margin:0;height:min(88svh,720px);}
  .ah-dark::after{background:linear-gradient(to top,rgba(14,8,10,.72) 0%,rgba(14,8,10,.25) 45%,transparent 65%);}
  .ah-light::after{background:linear-gradient(to top,rgba(255,255,255,.95) 0%,rgba(255,255,255,.7) 40%,transparent 62%);}
  .ah-in{left:20px;right:20px;bottom:28px;}
  .ah-btn{height:50px;padding:0 22px;font-size:16px;}
  .al{padding:48px 0 60px;margin-top:0;}
  .al-grid{grid-template-columns:1fr;gap:16px;}
  .ac{min-height:560px;border-radius:22px;}
  .ac-top{padding:28px 24px 18px;}
}
/* Apple Store proportions: a 4:5 tile, white page, quiet grey card, picture filling the bottom */
.al{background:#fff;padding:64px 0 80px;margin-top:0;}
.al-grid{grid-template-columns:repeat(3,minmax(0,400px));gap:20px;justify-content:start;}
.ac{aspect-ratio:4/5;min-height:0;background:#F5F5F7;border-radius:18px;}
.ac-top{padding:30px 30px 18px;}
.ac-eb{font-size:12px;letter-spacing:.03em;}
.ac h3{font-size:28px;margin-top:6px;}
.ac-ds{font-size:15px;margin-top:8px;line-height:1.45;}
.ac-pr{font-size:15px;margin-top:8px;}
.ac-pr span{font-size:13px;}
.ac-ctas{margin-top:14px;gap:16px;}
.ac-ctas .cx-btn.sm{height:38px;padding:0 16px;font-size:14px;}
.ac-media.th-media{min-height:0;background:#ECECEF;}
.ac .th-switch.on-img{left:14px;bottom:14px;}
.al .ap-note{background:#FAFBFC;border:1px solid var(--line,#E9EBEF);margin-top:20px;max-width:1240px;}
@media(max-width:1300px){.al-grid{grid-template-columns:repeat(3,minmax(0,1fr));}}
@media(max-width:1060px){.al-grid{grid-template-columns:repeat(2,minmax(0,1fr));}}
@media(max-width:680px){.al-grid{grid-template-columns:1fr;}.ac{aspect-ratio:auto;min-height:520px;}}
.ac-ctas{flex-wrap:nowrap;gap:12px;margin-top:16px;}
.ac-buy{display:inline-flex;align-items:center;height:36px;padding:0 16px;border-radius:4px;background:var(--brand-deep,#C41D56);color:#fff;font-size:14px;font-weight:700;text-decoration:none;white-space:nowrap;}
.ac-buy:hover{background:var(--brand-press,#A8184B);}
.ac-link{white-space:nowrap;font-size:14px;}
/* Occasion pages open on the designs: the heading is the page title */
h1.al-h{font-size:clamp(32px,3.6vw,52px);line-height:1.06;letter-spacing:-.035em;max-width:24ch;margin-bottom:36px;}
.al:first-child{padding-top:56px;}
.ac-media{flex:1;min-height:0;margin-top:auto;overflow:hidden;background:#ECECEF;}
.ac-media img{width:100%;height:100%;object-fit:cover;display:block;object-position:center 22%;}
.ac-ds{font-size:15px;line-height:1.5;}
.ac-ctas{gap:22px;}
/* Him or her: asked after "Watch the demo" / "Create yours" */
.ac-pick{display:flex;flex-wrap:wrap;align-items:center;gap:6px 18px;margin-top:12px;padding-top:12px;border-top:1px solid #E3E3E8;font-size:14px;}
.ac-pick[hidden]{display:none;}
.ac-pick-q{color:var(--muted,#5E636B);font-weight:500;}
@media(max-width:680px){.al:first-child{padding-top:32px;}h1.al-h{margin-bottom:24px;}}
.al .ac{aspect-ratio:auto;min-height:0;}
.al .ac-media{flex:none;aspect-ratio:16/11;}
h1.al-h{max-width:30ch;}
/* Page title kept for search engines and screen readers, not shown */
.vh{position:absolute!important;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0;}
.cx-chip{border-radius:4px;}

/* Compact cards: the whole card is the link; a few words, the price, and the picture */
.al .ac-top{padding:24px 24px 18px;}
.al .ac h3{font-size:22px;margin:0;display:flex;align-items:center;gap:6px;}
.al .ac-ds{font-size:14.5px;line-height:1.45;margin-top:6px;color:var(--muted,#5E636B);}
.al .ac-pr{font-size:15px;margin-top:10px;display:flex;align-items:baseline;flex-wrap:wrap;gap:4px 8px;}
.al .ac-pr s{color:#8A8F98;font-weight:600;font-size:14px;}
.al .ac-pr .ac-free{color:var(--brand-press,#A8184B);font-weight:700;font-size:13.5px;}
@media(min-width:1200px){.al-grid{grid-template-columns:repeat(4,minmax(0,1fr));max-width:none;}}
.ac-badge{display:inline-block;font-size:12px;font-weight:800;padding:4px 10px;border-radius:999px;background:#EDEDF0;color:#5E636B;}
.al .ac-media{aspect-ratio:16/10;}
a.ac-go{text-decoration:none;color:inherit;cursor:pointer;transition:transform .2s ease,box-shadow .2s ease;}
a.ac-go:hover{transform:translateY(-3px);box-shadow:0 18px 40px -22px rgba(13,18,22,.35);}
a.ac-go:focus-visible{outline:3px solid var(--brand,#D4225F);outline-offset:3px;}
.ac-arr{color:var(--brand,#D4225F);font-weight:700;transition:transform .2s ease;}
a.ac-go:hover .ac-arr{transform:translateX(3px);}
.ac-soon .ac-media img{opacity:.85;}
@media(prefers-reduced-motion:reduce){a.ac-go,a.ac-go .ac-arr{transition:none;}a.ac-go:hover{transform:none;}}
/* picture first, then the words */
.al .ac-media{order:-1;margin-top:0;}
.al .ac-top{padding:20px 24px 24px;}
