:root{
  --midnight:#1A1F4B;
  --midnight-2:#27224A;
  --body:#FAFAF7;
  --paper:#FFFFFF;
  --cream:#F8EEDC;
  --cream-2:#FFF7EA;
  --ink:#201A15;
  --muted:#625B54;
  --muted-blue:#5F6C94;
  --line:rgba(32,26,21,.10);
  --line-strong:rgba(32,26,21,.16);
  --primary:#F59E0B;
  --primary-2:#F97316;
  --primary-dark:#A84E08;
  --teal:#14B8A6;
  --shadow-card:0 12px 26px rgba(30,24,16,.075);
  --shadow-strong:0 22px 54px rgba(26,31,75,.14);
  --container:1120px;
  --header-h:70px;
  --ease:cubic-bezier(.2,.8,.2,1);
}

*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{
  margin:0;
  font-family:"Nunito Sans",system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  background:var(--body);
  color:var(--ink);
  font-size:15.5px;
  line-height:1.56;
  text-rendering:optimizeLegibility;
  -webkit-font-smoothing:antialiased;
}
body.nav-open{overflow:hidden}
img,video{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
button,input,textarea,select{font:inherit}
button{cursor:pointer}
.skip-link{position:fixed;top:12px;left:12px;transform:translateY(-160%);z-index:9999;background:var(--paper);color:var(--midnight);border:2px solid var(--primary);padding:9px 13px;border-radius:999px;font-weight:700;transition:transform .25s var(--ease)}
.skip-link:focus{transform:translateY(0)}

.site-header{
  position:sticky;top:0;z-index:60;height:var(--header-h);
  display:flex;align-items:center;justify-content:space-between;gap:22px;
  padding:0 clamp(18px,4vw,56px);
  background:rgba(250,250,247,.94);backdrop-filter:blur(16px);
  border-bottom:1px solid rgba(26,31,75,.075);
  transition:box-shadow .25s var(--ease),height .25s var(--ease),background .25s var(--ease)
}
.site-header.is-scrolled{height:64px;box-shadow:0 10px 22px rgba(26,31,75,.065);background:rgba(250,250,247,.97)}
.brand{display:inline-flex;align-items:center;gap:11px;min-width:max-content}
.brand-mark{width:40px;height:40px;display:inline-grid;place-items:center;border-radius:12px;background:linear-gradient(145deg,var(--midnight),#222b73);color:#fff;font-size:14px;font-weight:800;letter-spacing:.02em;border:1.5px solid var(--primary);box-shadow:0 7px 18px rgba(245,158,11,.18)}
.brand-text{font-family:"Fraunces",Georgia,serif;font-weight:600;font-size:19px;color:var(--ink);letter-spacing:-.03em}
.desktop-nav{display:flex;align-items:center;justify-content:center;gap:clamp(16px,2vw,30px)}
.desktop-nav a{position:relative;color:rgba(32,26,21,.78);font-size:14.5px;font-weight:600;letter-spacing:-.005em;transition:color .2s var(--ease)}
.desktop-nav a::after{content:"";position:absolute;left:0;right:0;bottom:-8px;height:2px;border-radius:99px;background:linear-gradient(90deg,var(--primary),var(--primary-2));transform:scaleX(0);transform-origin:left;transition:transform .25s var(--ease)}
.desktop-nav a:hover,.desktop-nav a:focus-visible,.desktop-nav a[aria-current="page"]{color:var(--midnight)}
.desktop-nav a:hover::after,.desktop-nav a:focus-visible::after,.desktop-nav a[aria-current="page"]::after{transform:scaleX(1)}
.menu-button{width:44px;height:44px;display:none;place-items:center;border:0;border-radius:14px;background:rgba(26,31,75,.055);padding:0}
.menu-button span{width:22px;height:2px;border-radius:999px;background:var(--ink);display:block;margin:3px 0;transition:transform .25s var(--ease),opacity .2s var(--ease)}
.menu-button[aria-expanded="true"] span:nth-child(1){transform:translateY(8px) rotate(45deg)}
.menu-button[aria-expanded="true"] span:nth-child(2){opacity:0}
.menu-button[aria-expanded="true"] span:nth-child(3){transform:translateY(-8px) rotate(-45deg)}
.mobile-nav{position:fixed;z-index:59;top:var(--header-h);left:16px;right:16px;background:rgba(255,255,255,.98);border:1px solid var(--line);border-radius:20px;box-shadow:var(--shadow-strong);padding:10px;animation:mobileNavIn .24s var(--ease)}
.mobile-nav a{display:block;padding:13px 14px;border-radius:14px;color:var(--ink);font-weight:650}
.mobile-nav a:hover,.mobile-nav a:focus-visible,.mobile-nav a[aria-current="page"]{background:var(--cream-2)}
@keyframes mobileNavIn{from{opacity:0;transform:translateY(-8px) scale(.98)}to{opacity:1;transform:translateY(0) scale(1)}}

.section,.section-dark{position:relative;padding:clamp(42px,5.6vw,74px) clamp(18px,4vw,56px)}
.section{background:var(--body)}
.section-dark{
  background:radial-gradient(circle at 16% 28%,rgba(245,158,11,.12),transparent 26%),radial-gradient(circle at 88% 24%,rgba(249,115,22,.10),transparent 30%),linear-gradient(135deg,var(--midnight),#15183F 58%,#261E3C);
  color:#fff;overflow:hidden
}
.simple-page-section{padding-top:clamp(38px,4.8vw,64px)}
.eyebrow{margin:0 0 9px;text-transform:uppercase;letter-spacing:.08em;font-size:10.5px;font-weight:750;color:var(--primary);line-height:1.2}
.section-dark .eyebrow{color:#FFD27A}
h1,h2,h3{margin-top:0}
.section-heading{max-width:690px;margin:0 auto clamp(22px,3.4vw,34px);text-align:center}
.section-heading.tight-heading{margin-bottom:26px}
.section-heading h1,.section-heading h2,.final-cta h2,.how-copy h1,.how-copy h2,.faq-page-title h1,.legal-card h1{
  margin:0;
  font-family:"Fraunces",Georgia,serif;
  font-size:clamp(30px,3.3vw,42px);
  line-height:1.08;
  letter-spacing:-.04em;
  font-weight:600;
  color:var(--ink)
}
.section-heading p{margin:12px auto 0;max-width:600px;color:var(--muted);font-size:clamp(14.5px,1.25vw,16px);line-height:1.58}
.section-dark h1,.section-dark h2,.section-dark p{color:#fff}
.section-cta{margin-top:clamp(20px,3vw,30px);display:flex;justify-content:center}

.btn-primary,.btn-secondary{
  position:relative;isolation:isolate;display:inline-flex;align-items:center;justify-content:center;
  min-height:46px;padding:11px 21px;border-radius:999px;font-size:14px;font-weight:800;
  letter-spacing:-.005em;border:1px solid transparent;
  transition:transform .22s var(--ease),box-shadow .22s var(--ease),background .22s var(--ease),color .22s var(--ease)
}
.btn-primary{color:#1b1207;background:linear-gradient(135deg,var(--primary),var(--primary-2));box-shadow:0 12px 24px rgba(249,115,22,.20)}
.btn-primary:hover,.btn-primary:focus-visible{transform:translateY(-2px);box-shadow:0 17px 32px rgba(249,115,22,.26)}
.btn-secondary{color:var(--midnight);background:rgba(255,255,255,.80);border-color:rgba(26,31,75,.13);box-shadow:0 8px 18px rgba(26,31,75,.06)}
.btn-secondary:hover,.btn-secondary:focus-visible{background:#fff;transform:translateY(-2px)}
.btn-shine{overflow:hidden}
.btn-shine::after{content:"";position:absolute;inset:-120% auto -120% -35%;width:34%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.48),transparent);transform:rotate(18deg);animation:buttonShine 5.2s ease-in-out infinite;z-index:-1}
@keyframes buttonShine{0%,48%{left:-40%;opacity:0}56%{opacity:.8}70%{left:124%;opacity:0}100%{left:124%;opacity:0}}

.hero{
  min-height:calc(100svh - var(--header-h));
  display:grid;grid-template-columns:minmax(0,.9fr) minmax(330px,.95fr);
  align-items:center;gap:clamp(24px,4vw,54px);
  padding-top:clamp(18px,2.8vw,34px);padding-bottom:clamp(18px,3vw,38px)
}
.motif{position:absolute;pointer-events:none;opacity:.08;font-weight:700;color:var(--primary);line-height:1}
.motif-one{top:25%;left:9%;font-size:56px;transform:rotate(10deg)}
.motif-two{right:10%;bottom:6%;font-size:90px;color:#fff;opacity:.055}
.motif-three{left:50%;bottom:10%;font-size:74px;color:var(--primary);opacity:.075}
.hero-content{position:relative;z-index:2;max-width:600px}
.hero h1{
  margin:0;max-width:620px;
  font-family:"Fraunces",Georgia,serif;
  font-size:clamp(40px,4.45vw,54px);
  line-height:1.08;letter-spacing:-.047em;font-weight:600
}
.hero-copy{margin:17px 0 0;max-width:560px;color:rgba(255,255,255,.82)!important;font-size:clamp(15.5px,1.3vw,17px);font-weight:400;line-height:1.52;letter-spacing:0}
.hero-actions{margin-top:24px;display:flex;flex-wrap:wrap;gap:12px}
.hero-visual{position:relative;z-index:2;display:grid;align-items:center}
.book-frame.hero-showcase{
  position:relative;width:min(100%,590px);height:min(58vh,470px);min-height:385px;
  border-radius:30px;overflow:hidden;margin-inline:auto;
  background:radial-gradient(circle at 50% 18%,rgba(255,255,255,.92),rgba(255,248,236,.95) 42%,rgba(248,238,220,.97));
  border:1px solid rgba(255,255,255,.34);
  box-shadow:0 26px 72px rgba(0,0,0,.20),inset 0 1px 0 rgba(255,255,255,.70)
}
.hero-scene{position:absolute;inset:18px;border-radius:22px;opacity:0;transition:opacity .7s var(--ease),transform .7s var(--ease);overflow:hidden}
.hero-scene.active{opacity:1;transform:scale(1)}
.hero-scene-fan img{width:100%;height:100%;object-fit:cover}
.hero-scene-stapled{background:radial-gradient(circle at 50% 16%,#fff8ec,#f8eedc)}
.stapled-book-carousel{position:relative;width:100%;height:100%}
.stapled-book{
  position:absolute;left:50%;top:50%;width:32%;max-width:170px;min-width:122px;aspect-ratio:3/4.15;
  margin:0;border-radius:14px;overflow:hidden;background:#fff;box-shadow:0 18px 34px rgba(26,31,75,.20);
  transform:translate(-50%,-50%);transition:transform .55s var(--ease),opacity .55s var(--ease),filter .55s var(--ease)
}
.stapled-book img{width:100%;height:100%;object-fit:cover}
.stapled-book.active{z-index:4;transform:translate(-50%,-50%) scale(1.04);opacity:1}
.stapled-book.next{z-index:3;transform:translate(6%,-48%) rotate(8deg) scale(.88);opacity:.72}
.stapled-book.far-next{z-index:2;transform:translate(56%,-45%) rotate(13deg) scale(.72);opacity:.35;filter:saturate(.86)}
.stapled-book.prev{z-index:2;transform:translate(-158%,-48%) rotate(-10deg) scale(.82);opacity:.55}
.staple-line{position:absolute;left:8px;top:0;bottom:0;width:2px;background:rgba(30,24,16,.12);z-index:2}
.stapled-dots{position:absolute;bottom:14px;left:0;right:0;display:flex;justify-content:center;gap:7px}
.stapled-dots span{width:7px;height:7px;border-radius:999px;background:rgba(26,31,75,.25)}
.stapled-dots span.active{width:20px;background:linear-gradient(90deg,var(--primary),var(--primary-2))}
.shine-layer{position:absolute;inset:0;background:linear-gradient(115deg,transparent 35%,rgba(255,255,255,.22) 46%,transparent 56%);transform:translateX(-120%);animation:softShowcaseShine 7s ease-in-out infinite;pointer-events:none}
@keyframes softShowcaseShine{0%,40%{transform:translateX(-120%)}55%{transform:translateX(120%)}100%{transform:translateX(120%)}}

.launch-strip{overflow:hidden;background:#5686BD;color:#fff;height:38px;display:flex;align-items:center;white-space:nowrap}
.launch-marquee{display:inline-flex;min-width:200%;font-size:13px;font-weight:600;letter-spacing:.005em;animation:marqueeRightToLeft 28s linear infinite}
.launch-marquee span{display:inline-block;padding-right:48px}
@keyframes marqueeRightToLeft{from{transform:translateX(0)}to{transform:translateX(-50%)}}

.book-grid,.gift-grid{max-width:var(--container);margin:0 auto;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(16px,2.2vw,24px)}
.story-card,.gift-card,.reaction-feature,.faq-item,.contact-card,.contact-form,.legal-card,.mini-info,.story-theme-box{background:rgba(255,255,255,.92);border:1px solid var(--line);box-shadow:var(--shadow-card)}
.story-card{border-radius:22px;overflow:hidden;display:flex;flex-direction:column;transition:transform .28s var(--ease),box-shadow .28s var(--ease),border-color .28s var(--ease)}
.story-card:hover{transform:translateY(-5px);box-shadow:0 18px 34px rgba(30,24,16,.11);border-color:rgba(245,158,11,.22)}
.story-image{position:relative;overflow:hidden;background:linear-gradient(180deg,var(--cream-2),#fff)}
.static-cover{aspect-ratio:4/3.25;display:grid;place-items:center;padding:14px}
.static-cover img{width:100%;height:100%;object-fit:contain}
.story-body{padding:16px 16px 18px;display:flex;flex-direction:column;flex:1}
.story-body h3{
  margin:0;font-family:"Fraunces",Georgia,serif;
  font-size:clamp(20px,1.6vw,23px);line-height:1.08;letter-spacing:-.035em;font-weight:600
}
.story-body p{margin:8px 0 0;color:var(--muted);font-size:14px;line-height:1.48}
.story-meta{margin:14px 0;display:flex;align-items:center;justify-content:space-between;gap:9px;flex-wrap:wrap}
.price-block{display:inline-flex;align-items:center;gap:7px;flex-wrap:wrap}
.price-was{color:#8A7D6D;font-size:13px;font-weight:600}
.price-now{color:var(--midnight);font-size:20px;font-weight:800;letter-spacing:-.03em}
.price-tag,.age-tag,.price-note{display:inline-flex;min-height:23px;align-items:center;padding:3.5px 7px;border-radius:999px;font-size:10.5px;font-weight:750}
.price-tag{color:var(--primary-dark);background:rgba(245,158,11,.13)}
.age-tag{color:#0F766E;background:rgba(20,184,166,.11)}
.price-note{color:var(--muted);background:#fff}
.story-body .btn-primary{margin-top:auto;width:100%}

.reactions-section{background:linear-gradient(180deg,var(--body),#fff)}
.reaction-feature{
  max-width:860px;margin:0 auto;border-radius:26px;overflow:hidden;
  display:grid;grid-template-columns:minmax(280px,.85fr) minmax(280px,1fr);align-items:center;
  background:linear-gradient(135deg,#fffaf1,#fff)
}
.reaction-photo-wrap{padding:18px;background:linear-gradient(135deg,#F8EEDC,#FFF8EC)}
.reaction-carousel{position:relative;min-height:315px;display:grid;place-items:center;border-radius:22px;background:#fff7ea;overflow:hidden}
.reaction-carousel::before{content:"";position:absolute;inset:12px;border-radius:18px;background:rgba(255,255,255,.68);box-shadow:inset 0 0 0 1px rgba(30,24,16,.07)}
.reaction-carousel img{position:absolute;inset:18px;width:calc(100% - 36px);height:calc(100% - 36px);object-fit:contain;opacity:0;transition:opacity .45s var(--ease);border-radius:16px;z-index:2}
.reaction-carousel img.active{opacity:1}
.reaction-dots,.preview-dots{position:absolute;bottom:12px;left:0;right:0;display:flex;justify-content:center;gap:7px;z-index:4}
.reaction-dot,.preview-dot{width:7px;height:7px;padding:0;border-radius:999px;border:0;background:rgba(26,31,75,.23);transition:width .25s var(--ease),background .25s var(--ease)}
.reaction-dot.active,.preview-dot.active{width:20px;background:linear-gradient(90deg,var(--primary),var(--primary-2))}
.reaction-feature blockquote{margin:0;padding:26px}
.reaction-feature blockquote p{margin:0;color:var(--ink);font-family:"Fraunces",Georgia,serif;font-size:clamp(24px,2.6vw,34px);line-height:1.18;font-weight:550;letter-spacing:-.04em}
.reaction-feature footer{margin-top:14px;color:var(--muted);font-size:14.5px;font-weight:650}

.process-section{background:radial-gradient(circle at 94% 10%,rgba(20,184,166,.08),transparent 26%),var(--cream-2)}
.how-split{max-width:var(--container);margin:0 auto;display:grid;grid-template-columns:minmax(0,.9fr) minmax(320px,.85fr);gap:clamp(30px,5vw,70px);align-items:center}
.how-copy h1,.how-copy h2{font-family:"Fraunces",Georgia,serif;font-size:clamp(30px,3.1vw,40px);line-height:1.1;letter-spacing:-.04em;font-weight:600}
.timeline-steps{display:grid;gap:13px;margin:22px 0 22px}
.timeline-step{display:grid;grid-template-columns:42px 1fr;gap:13px;align-items:start}
.timeline-step span{width:38px;height:38px;display:inline-grid;place-items:center;border-radius:50%;background:#5686BD;color:#fff;font-weight:700;box-shadow:0 8px 16px rgba(86,134,189,.18)}
.timeline-step h3{margin:1px 0 2px;font-size:17px;line-height:1.22;font-weight:650;letter-spacing:-.015em}
.timeline-step p{margin:0;color:var(--muted-blue);line-height:1.45;font-size:14.4px}

.phone-stage{position:relative;min-height:480px;display:grid;place-items:center;perspective:1200px}
.phone-shadow{position:absolute;width:280px;height:48px;border-radius:50%;background:rgba(26,31,75,.14);filter:blur(18px);bottom:18px;transform:rotate(-6deg)}
.phone-device{position:relative;width:min(100%,320px);border-radius:38px;background:#111827;padding:12px;box-shadow:0 28px 62px rgba(26,31,75,.22),inset 0 0 0 2px rgba(255,255,255,.10);transform:rotate(-5deg) rotateY(-7deg);transition:transform .35s var(--ease)}
.phone-device:hover{transform:rotate(-3deg) rotateY(-4deg) translateY(-3px)}
.phone-notch{position:absolute;z-index:5;top:20px;left:50%;transform:translateX(-50%);width:82px;height:22px;border-radius:999px;background:#111827}
.whatsapp-mockup{width:100%;border-radius:28px;overflow:hidden;background:#ece5dd;font-family:inherit;box-shadow:inset 0 0 0 1px rgba(255,255,255,.08)}
.wa-header{min-height:56px;padding:21px 14px 10px;display:flex;align-items:center;gap:10px;background:#075e54;color:#fff}
.wa-avatar{width:36px;height:36px;flex:0 0 36px;border-radius:50%;display:grid;place-items:center;background:#25d366;color:#fff;font-size:12px;font-weight:800}
.wa-header strong{display:block;color:#fff;font-size:14px;font-weight:700;line-height:1.2}
.wa-status{display:block;margin-top:2px;color:rgba(255,255,255,.75);font-size:11px;font-weight:500;line-height:1.2}
.wa-messages{min-height:335px;padding:13px 11px 17px;display:flex;flex-direction:column;gap:7px;background:#ece5dd}
.wa-msg{max-width:80%;padding:7px 10px;color:#1e1810;font-size:12px;line-height:1.36;box-shadow:0 1px 2px rgba(0,0,0,.11);opacity:0;transform:translateY(10px);animation:waFadeUp .4s ease forwards;animation-play-state:paused}
.wa-msg-out{align-self:flex-end;background:#dcf8c6;border-radius:15px 4px 15px 15px}
.wa-msg-in{align-self:flex-start;background:#fff;border-radius:4px 15px 15px 15px}
.wa-visible .wa-msg{animation-play-state:running}
.wa-messages .wa-msg:nth-child(1){animation-delay:.2s}.wa-messages .wa-msg:nth-child(2){animation-delay:.5s}.wa-messages .wa-msg:nth-child(3){animation-delay:.9s}.wa-messages .wa-msg:nth-child(4){animation-delay:1.3s}.wa-messages .wa-msg:nth-child(5){animation-delay:1.7s}.wa-messages .wa-msg:nth-child(6){animation-delay:2s}.wa-messages .wa-msg:nth-child(7){animation-delay:2.3s}
@keyframes waFadeUp{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}

.gift-card{border-radius:22px;padding:20px;display:flex;min-height:235px;flex-direction:column;transition:transform .28s var(--ease),box-shadow .28s var(--ease),border-color .28s var(--ease)}
.gift-card:hover{transform:translateY(-5px);box-shadow:0 18px 34px rgba(30,24,16,.11);border-color:rgba(245,158,11,.22)}
.gift-icon{width:48px;height:48px;display:inline-grid;place-items:center;border-radius:16px;background:var(--cream-2);font-size:23px;box-shadow:inset 0 0 0 1px rgba(245,158,11,.13)}
.gift-card h3{font-family:"Fraunces",Georgia,serif;margin:16px 0 0;font-size:22px;line-height:1.12;letter-spacing:-.035em;font-weight:600}
.gift-card p{margin:9px 0 18px;color:var(--muted);font-size:14.3px;line-height:1.5}
.gift-card .btn-primary{margin-top:auto;width:100%;font-size:13.5px}

.faq-section,.faq-page{background:#fff}
.faq-page-inner{max-width:880px;margin:0 auto;display:grid;gap:30px}
.faq-page-title{margin-bottom:0}
.faq-page-title h1{font-family:"Fraunces",Georgia,serif;font-size:clamp(34px,4vw,50px);font-weight:600}
.faq-group h2{font-family:"Fraunces",Georgia,serif;font-size:26px;margin:0 0 12px;letter-spacing:-.035em;font-weight:600}
.faq-list{max-width:820px;margin:0 auto;display:grid;gap:10px}
.faq-page .faq-list{max-width:none}
.faq-item{border-radius:18px;overflow:hidden}
.faq-q{width:100%;min-height:56px;display:flex;align-items:center;justify-content:space-between;gap:14px;border:0;background:#fff;color:var(--ink);text-align:left;padding:15px 18px;font-weight:600;font-size:15.2px;letter-spacing:0}
.faq-q:hover{background:var(--cream-2)}
.faq-chevron{flex:0 0 auto;width:28px;height:28px;display:inline-grid;place-items:center;border-radius:50%;background:rgba(245,158,11,.11);color:var(--primary-dark);font-size:18px;font-weight:700;transition:transform .25s var(--ease),background .25s var(--ease)}
.faq-item.is-open .faq-chevron{transform:rotate(45deg);background:rgba(249,115,22,.15)}
.faq-a{padding:0 18px 16px;color:var(--muted)}
.faq-a p{margin:0;max-width:740px}

.final-cta{text-align:center;padding-top:clamp(48px,6vw,78px);padding-bottom:clamp(48px,6vw,78px)}
.final-cta-inner{max-width:700px;margin:0 auto}
.final-cta h2{font-family:"Fraunces",Georgia,serif;color:#fff;font-weight:600}
.final-cta p{margin:14px auto 22px;max-width:540px;color:rgba(255,255,255,.78);font-size:16px}
.site-footer{background:#120F24;color:rgba(255,255,255,.72);padding:44px clamp(18px,4vw,56px) 20px}
.footer-inner{max-width:1440px;margin:0 auto;display:grid;grid-template-columns:1.35fr repeat(3,minmax(130px,.7fr));gap:26px}
.footer-brand p{margin:14px 0 0;max-width:350px;font-size:14px;color:rgba(255,255,255,.66)}
.site-footer .brand-text{color:#fff}
.footer-col{display:grid;align-content:start;gap:8px}
.footer-col h4{margin:0 0 5px;color:#fff;font-size:11px;letter-spacing:.10em;text-transform:uppercase;font-weight:750}
.footer-col a{color:rgba(255,255,255,.68);font-size:14px;transition:color .18s var(--ease),transform .18s var(--ease)}
.footer-col a:hover,.footer-col a:focus-visible{color:#fff;transform:translateX(2px)}
.footer-bottom{max-width:1440px;margin:28px auto 0;padding-top:18px;border-top:1px solid rgba(255,255,255,.10);color:rgba(255,255,255,.55);font-size:13px;text-align:center}

.floating-whatsapp{position:fixed;right:clamp(18px,2.6vw,34px);bottom:clamp(18px,3vw,34px);width:58px;height:58px;border-radius:999px;display:grid;place-items:center;background:#25D366;color:#fff;box-shadow:0 16px 36px rgba(37,211,102,.34),0 0 0 9px rgba(37,211,102,.10);z-index:90;transition:transform .2s var(--ease),box-shadow .2s var(--ease)}
.floating-whatsapp::before{content:"";position:absolute;inset:-10px;border-radius:999px;border:1px solid rgba(37,211,102,.28);animation:whatsappPulse 2.8s ease-out infinite;pointer-events:none}
.floating-whatsapp:hover,.floating-whatsapp:focus-visible{transform:translateY(-2px);box-shadow:0 18px 42px rgba(37,211,102,.40),0 0 0 10px rgba(37,211,102,.12)}
.floating-whatsapp svg{width:31px;height:31px;display:block;position:relative;z-index:1}
@keyframes whatsappPulse{0%{transform:scale(.88);opacity:.58}70%{transform:scale(1.34);opacity:0}100%{transform:scale(1.34);opacity:0}}

.books-page-section{padding-top:clamp(38px,4.8vw,64px)}
.product-page{padding:clamp(26px,3.6vw,48px) clamp(18px,4vw,56px) clamp(42px,5.4vw,68px)}
.back-link{display:inline-flex;margin:0 auto 16px;max-width:var(--container);color:var(--muted);font-weight:650}
.product-main{display:grid;grid-template-columns:minmax(290px,.85fr) minmax(320px,1fr);gap:clamp(26px,4.5vw,56px);align-items:center;max-width:var(--container);margin:0 auto}
.product-preview{display:grid;gap:14px}
.preview-carousel{position:relative;border-radius:26px;overflow:hidden;background:radial-gradient(circle at 50% 18%,#fffaf0,#f8eedc);box-shadow:var(--shadow-strong);aspect-ratio:4/3.35;border:1px solid rgba(26,31,75,.10);display:grid;place-items:center}
.preview-carousel::before{content:"";position:absolute;inset:14px;border-radius:20px;background:rgba(255,255,255,.55)}
.preview-carousel img{position:absolute;inset:14px;width:calc(100% - 28px);height:calc(100% - 28px);object-fit:contain;opacity:0;transform:scale(1.01);transition:opacity .35s var(--ease),transform .5s var(--ease);z-index:2}
.preview-carousel img.active{opacity:1;transform:scale(1)}
.preview-dots{bottom:10px}
.highlight-list{list-style:none;padding:14px;margin:0;display:grid;gap:7px;border-radius:18px;background:#fff;border:1px solid var(--line);box-shadow:var(--shadow-card)}
.highlight-list li{position:relative;padding-left:22px;color:var(--muted);font-weight:600;font-size:13.7px}
.highlight-list li::before{content:"✓";position:absolute;left:0;top:0;color:#0F766E;font-weight:800}
.product-details h1{font-family:"Fraunces",Georgia,serif;margin:0;font-size:clamp(34px,4.5vw,54px);line-height:1.03;letter-spacing:-.045em;font-weight:600}
.product-sub{font-size:16px;color:var(--muted);line-height:1.52;margin:14px 0}
.product-details > .price-block{margin:2px 0 4px}
.story-theme-box{border-radius:20px;padding:16px;margin:0 0 18px}
.story-theme-box h2{font-family:"Fraunces",Georgia,serif;font-size:22px;line-height:1.1;margin:0 0 7px;letter-spacing:-.035em;font-weight:600}
.story-theme-box p{margin:0;color:var(--muted);font-size:14.2px;line-height:1.5}
.order-info-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:18px 0 20px}
.mini-info{border-radius:18px;padding:14px;background:#fff;min-height:138px}
.mini-info h3{font-family:"Fraunces",Georgia,serif;font-size:19px;line-height:1.1;margin:0 0 9px;letter-spacing:-.03em;font-weight:600}
.mini-info ul{margin:0;padding-left:18px;color:var(--muted);display:grid;gap:5px;font-size:13.8px;line-height:1.35}
.photo-guide-mini{padding:6px;display:grid;place-items:center;background:#fff7ea}
.photo-guide-mini img{display:block;width:100%;height:auto;max-height:100%;object-fit:contain;border-radius:16px}
.reassurance{color:var(--muted);font-weight:400;margin:12px 0 0;font-size:11.5px;line-height:1.42}

.contact-grid{max-width:var(--container);margin:0 auto;display:grid;grid-template-columns:.8fr 1.1fr .8fr;gap:22px;align-items:stretch}
.contact-card,.contact-form{border-radius:22px;padding:22px}
.contact-card h2,.contact-form h2{font-family:"Fraunces",Georgia,serif;margin:16px 0 8px;font-size:24px;letter-spacing:-.035em;font-weight:600}
.contact-card p{color:var(--muted)}
.contact-form{display:grid;gap:12px}
.contact-form label{display:grid;gap:7px;color:var(--muted);font-weight:650}
.contact-form input,.contact-form textarea{width:100%;border:1px solid var(--line-strong);border-radius:13px;padding:11px 13px;background:#fff;color:var(--ink);outline:none}
.contact-form input:focus,.contact-form textarea:focus{border-color:var(--primary);box-shadow:0 0 0 4px rgba(245,158,11,.13)}
.legal-section{background:#fff}
.legal-card{max-width:840px;margin:0 auto;border-radius:24px;padding:26px}
.legal-card h1{margin:0 0 10px}
.legal-intro{font-size:16px;color:var(--muted)}
.legal-card ul{margin:18px 0 0;padding-left:20px;color:var(--muted);display:grid;gap:9px}

.reveal{opacity:0;transform:translateY(14px);transition:opacity .62s var(--ease),transform .62s var(--ease)}
.reveal.is-visible{opacity:1;transform:translateY(0)}
.delay-1{transition-delay:.08s}.delay-2{transition-delay:.14s}.delay-3{transition-delay:.20s}

@media(max-width:1120px){
  .hero{grid-template-columns:1fr;min-height:auto;text-align:center}
  .hero-content{margin:0 auto}
  .hero-copy{margin-left:auto;margin-right:auto}
  .hero-actions{justify-content:center}
  .hero-visual{order:-1;max-width:720px;width:100%;margin:0 auto}
  .book-frame.hero-showcase{height:min(52vh,440px)}
  .how-split,.product-main{grid-template-columns:1fr}
  .phone-stage{min-height:460px}
  .footer-inner{grid-template-columns:1fr 1fr}
  .contact-grid{grid-template-columns:1fr}
}
@media(max-width:920px){
  :root{--header-h:68px}
  .desktop-nav{display:none}
  .menu-button{display:grid}
  .book-grid,.gift-grid{grid-template-columns:1fr;max-width:430px}
  .reaction-feature{grid-template-columns:1fr;max-width:440px}
  .reaction-carousel{min-height:300px}
}
@media(max-width:640px){
  body{font-size:15px}
  .floating-whatsapp{width:52px;height:52px;right:16px;bottom:18px;box-shadow:0 14px 30px rgba(37,211,102,.32),0 0 0 8px rgba(37,211,102,.10)}
  .floating-whatsapp svg{width:28px;height:28px}

  .site-header{padding:0 16px}
  .brand-mark{width:38px;height:38px}
  .brand-text{font-size:18px}
  .section,.section-dark,.product-page{padding-left:16px;padding-right:16px}
  .hero{padding-top:14px;gap:18px}
  .hero-visual{order:-1}
  .book-frame.hero-showcase{height:41svh;min-height:300px;border-radius:24px}
  .hero-scene{inset:12px;border-radius:18px}
  .stapled-book{width:34%;min-width:92px;border-radius:11px}
  .hero h1{font-size:clamp(31px,9.8vw,38px);line-height:1.08;letter-spacing:-.045em}
  .hero-copy{margin-top:12px;font-size:15px;line-height:1.48}
  .hero-actions{margin-top:18px}
  .hero-actions .btn-primary,.final-cta .btn-primary{width:100%}
  .launch-strip{height:36px}
  .launch-marquee{font-size:12px}
  .section-heading{margin-bottom:20px}
  .section-heading h1,.section-heading h2,.final-cta h2,.how-copy h1,.how-copy h2,.faq-page-title h1{font-size:clamp(28px,8vw,36px);line-height:1.1}
  .section-heading p{font-size:14.5px;line-height:1.5}
  .static-cover{aspect-ratio:4/3.15;padding:13px}
  .story-body,.gift-card,.reaction-feature blockquote,.contact-card,.contact-form{padding:16px}
  .story-body h3{font-size:21px}
  .story-meta{align-items:flex-start;flex-direction:column;margin:12px 0}
  .timeline-step{grid-template-columns:38px 1fr;gap:11px}
  .timeline-step span{width:34px;height:34px}
  .timeline-step h3{font-size:16px}
  .phone-stage{min-height:440px}
  .phone-device{width:min(100%,300px);transform:rotate(-3deg)}
  .phone-device:hover{transform:rotate(-3deg)}
  .wa-messages{min-height:325px;padding:13px 10px}
  .wa-msg{max-width:84%;font-size:11.6px}
  .product-main{gap:20px}
  .preview-carousel{border-radius:20px;aspect-ratio:4/3.2}
  .product-details h1{font-size:clamp(32px,9.5vw,42px)}
  .product-sub{font-size:15px}
  .order-info-grid{grid-template-columns:minmax(0,1.08fr) minmax(0,.92fr);gap:10px;margin:16px 0 20px}
  .mini-info{min-height:132px;padding:12px}
  .mini-info h3{font-size:17px;margin-bottom:8px}
  .mini-info ul{font-size:12.2px;line-height:1.3;gap:4px;padding-left:16px}
  .photo-guide-mini{min-height:132px;padding:5px}
  .photo-guide-mini img{width:100%;height:auto;max-height:100%;border-radius:14px}
  .faq-q{min-height:54px;font-size:14.6px;padding:15px}
  .faq-a{padding:0 15px 15px}
  .footer-inner{grid-template-columns:1fr;gap:22px}
  .footer-bottom{text-align:left}
}
@media(max-width:390px){
  .hero h1{font-size:30px}
  .btn-primary,.btn-secondary{width:100%;padding-left:18px;padding-right:18px}
  .phone-device{width:100%}
  .wa-msg{max-width:88%;font-size:11.4px}
}
@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;scroll-behavior:auto!important;transition-duration:.001ms!important}
  .reveal{opacity:1;transform:none}
  .wa-msg{opacity:1;transform:none;animation:none}
  .floating-whatsapp::before{animation:none}
}
/* ==========================================================================
   v16 focused patch
   - Keep v13 hero carousel behavior untouched
   - Add light side breathing space outside the hero panel
   - Keep v14 hero text/subline direction
   - Single launch-offer ticker
   ========================================================================== */

/* Light page frame around the hero only. This does not touch carousel layers. */
.hero.section-dark {
  width: min(100% - clamp(28px, 7vw, 170px), 1500px);
  margin: 0 auto;
  border-left: 1px solid rgba(30, 24, 16, 0.04);
  border-right: 1px solid rgba(30, 24, 16, 0.04);
}

@media (min-width: 1121px) {
  .hero.section-dark {
    padding-left: clamp(54px, 5.4vw, 100px);
    padding-right: clamp(54px, 5.4vw, 100px);
  }

  .hero-content {
    margin-left: clamp(10px, 1.5vw, 28px);
  }
}

/* Only soften the hero text scale; do not affect other sections. */
.hero h1 {
  max-width: 560px;
  font-size: clamp(36px, 3.85vw, 50px);
  line-height: 1.08;
  font-weight: 600;
}

.hero-copy {
  max-width: 430px;
  font-size: clamp(15.5px, 1.22vw, 16.5px);
  line-height: 1.48;
}

/* Single launch-offer line moving from right to left */
.launch-marquee {
  min-width: auto !important;
  width: max-content;
  display: inline-flex;
  animation: singleLaunchTicker 13s linear infinite !important;
}

.launch-marquee span {
  padding-right: 0 !important;
  white-space: nowrap;
}

@keyframes singleLaunchTicker {
  from {
    transform: translateX(100vw);
  }

  to {
    transform: translateX(-100%);
  }
}

@media (max-width: 1120px) {
  .hero.section-dark {
    width: min(100% - 28px, 900px);
  }

  .hero h1 {
    max-width: 560px;
    margin-left: auto;
    margin-right: auto;
    font-size: clamp(34px, 6vw, 46px);
  }

  .hero-copy {
    max-width: 420px;
  }
}

@media (max-width: 640px) {
  .hero.section-dark {
    width: calc(100% - 20px);
  }

  .hero h1 {
    font-size: clamp(29px, 8.8vw, 36px);
    line-height: 1.09;
  }

  .hero-copy {
    font-size: 14.8px;
    max-width: 340px;
  }

  .launch-marquee {
    animation-duration: 10s !important;
  }
}
/* ==========================================================================
   v17 focused patch — hero only
   Revalidated: no HTML/JS/link changes. Carousel behavior remains v16/v13.
   ========================================================================== */

/* Reduce top/bottom dark hero area by roughly 10% without touching other sections */
.hero.section-dark {
  min-height: calc(90svh - var(--header-h));
  padding-top: clamp(14px, 2.4vw, 30px);
  padding-bottom: clamp(14px, 2.5vw, 32px);
}

/* Move the subline + button group slightly lower, without changing the headline */
.hero-copy {
  margin-top: clamp(24px, 3.1vh, 34px);
}

.hero-actions {
  margin-top: clamp(24px, 3vh, 34px);
}

/* Use the real cloth texture inside the stapled-book carousel scene only */
.hero-scene-stapled {
  background:
    linear-gradient(rgba(255, 248, 236, 0.22), rgba(255, 248, 236, 0.22)),
    url("../images/hero-carousel/hero-cloth-bg.webp") center / cover no-repeat;
}

/* Keep the carousel visible and make individual book covers fill the available carousel area better */
.stapled-book {
  width: 41%;
  max-width: 228px;
  min-width: 154px;
}

.stapled-book.active {
  transform: translate(-50%, -50%) scale(1.12);
}

.stapled-book.next {
  transform: translate(1%, -48%) rotate(8deg) scale(.98);
}

.stapled-book.prev {
  transform: translate(-153%, -48%) rotate(-10deg) scale(.94);
}

.stapled-book.far-next {
  transform: translate(51%, -45%) rotate(13deg) scale(.84);
}

/* Slightly increase visual frame usage while preserving the same hero layout */
.book-frame.hero-showcase {
  height: min(52vh, 445px);
}

@media (max-width: 1120px) {
  .hero.section-dark {
    min-height: auto;
  }

  .stapled-book {
    width: 40%;
    min-width: 132px;
  }
}

@media (max-width: 640px) {
  .hero.section-dark {
    min-height: auto;
    padding-top: 12px;
    padding-bottom: 18px;
  }

  .hero-copy {
    margin-top: 18px;
  }

  .hero-actions {
    margin-top: 20px;
  }

  .book-frame.hero-showcase {
    height: 37svh;
    min-height: 275px;
  }

  .stapled-book {
    width: 42%;
    min-width: 108px;
  }
}
/* ==========================================================================
   Hero carousel visibility patch
   Purpose:
   - Keep the existing v13/v16 carousel behavior
   - Show the individual book carousel earlier through JS
   - Make side books more visible and less faded
   - Use the cloth image as the carousel scene background
   ========================================================================== */

.hero-scene-stapled {
  background:
    linear-gradient(rgba(255, 248, 236, 0.18), rgba(255, 248, 236, 0.18)),
    url("../images/hero-carousel/hero-cloth-bg.webp") center / cover no-repeat;
}

/* Let the book covers occupy more of the carousel area */
.stapled-book {
  width: 40%;
  max-width: 220px;
  min-width: 150px;
}

/* Center book: larger and clearer */
.stapled-book.active {
  opacity: 1;
  transform: translate(-50%, -50%) scale(1.12);
}

/* Side books: more visible, less washed out */
.stapled-book.next {
  opacity: 0.82;
  filter: saturate(0.96) brightness(0.98);
  transform: translate(2%, -48%) rotate(8deg) scale(0.98);
}

.stapled-book.prev {
  opacity: 0.72;
  filter: saturate(0.96) brightness(0.98);
  transform: translate(-154%, -48%) rotate(-10deg) scale(0.94);
}

.stapled-book.far-next {
  opacity: 0.55;
  filter: saturate(0.92) brightness(0.98);
  transform: translate(52%, -45%) rotate(13deg) scale(0.84);
}

/* Keep the carousel box neat while giving side books enough room */
.hero-scene-stapled {
  overflow: hidden;
}

@media (max-width: 1120px) {
  .stapled-book {
    width: 40%;
    min-width: 132px;
  }
}

@media (max-width: 640px) {
  .stapled-book {
    width: 42%;
    min-width: 108px;
  }
}
/* ==========================================================================
   Logo-only patch
   - PNG logo loads first
   - SVG logo swaps in only after fully loaded through JS
   - Fixed box prevents header layout shift on mobile and desktop
   ========================================================================== */

.brand-logo {
  display: block;
  width: clamp(118px, 12vw, 154px);
  height: auto;
  max-height: 54px;
  object-fit: contain;
  object-position: left center;
  transition: opacity .45s var(--ease), filter .45s var(--ease);
}

.brand-logo.logo-is-loading {
  opacity: .98;
}

.brand-logo.logo-is-animated {
  opacity: 1;
}

@media (max-width: 640px) {
  .brand-logo {
    width: 124px;
    max-height: 48px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .brand-logo {
    transition: none;
  }
}


/* ==========================================================================
   v21 approved minimal polish from v19 base
   ========================================================================== */
.hero-mini-trust {
  margin: 10px 0 0;
  color: rgba(255,255,255,.72) !important;
  font-size: 11.5px;
  font-weight: 500;
  letter-spacing: .01em;
}

.story-note {
  margin: 0 !important;
  color: var(--muted-blue) !important;
  font-size: 11.5px !important;
  line-height: 1.38 !important;
  font-weight: 500;
}

.story-offer-line {
  margin: 13px 0 7px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  flex-wrap: wrap;
}

.story-offer-line .price-block {
  flex-wrap: nowrap;
}

.story-offer-line + .story-meta {
  margin: 0 0 14px;
}

.product-name-note {
  margin: 6px 0 0;
  color: var(--muted-blue);
  font-size: 11.5px;
  line-height: 1.38;
  font-weight: 400;
  font-style: italic;
}

.sample-name-note {
  margin-top: 5px !important;
  color: var(--muted-blue) !important;
  font-size: 11.5px !important;
  line-height: 1.38 !important;
  font-weight: 400 !important;
  font-style: italic;
}


.footer-logo-link {
  display: inline-flex;
  align-items: center;
  width: fit-content;
}

.footer-logo {
  width: min(170px, 52vw);
  height: auto;
  max-height: 62px;
  object-fit: contain;
}

.footer-socials {
  margin-top: 16px;
  display: grid;
  gap: 10px;
  align-items: start;
}

.footer-social-link {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  color: rgba(255,255,255,.78);
  font-size: 14px;
  font-weight: 650;
  transition: color .18s var(--ease), transform .18s var(--ease);
}

.footer-social-link:hover,
.footer-social-link:focus-visible {
  color: #fff;
  transform: translateX(2px);
}

.social-icon {
  width: 21px;
  height: 21px;
  flex: 0 0 21px;
  display: block;
}

.gifting-hero-grid,
.gifting-detail-grid {
  max-width: var(--container);
  margin: 0 auto;
  display: grid;
  grid-template-columns: minmax(0, .95fr) minmax(300px, .85fr);
  gap: clamp(24px, 4vw, 54px);
  align-items: center;
}

.gifting-detail-grid.reverse .gifting-placeholder { order: -1; }

.gifting-hero-copy h1,
.gifting-detail-copy h2 {
  margin: 0;
  font-family: "Fraunces", Georgia, serif;
  font-size: clamp(30px, 3.2vw, 42px);
  line-height: 1.09;
  letter-spacing: -.04em;
  font-weight: 600;
  color: var(--ink);
}

.gifting-hero-copy p:not(.eyebrow),
.gifting-detail-copy p,
.gifting-process-subtext {
  margin: 13px 0 0;
  max-width: 600px;
  color: var(--muted);
  font-size: clamp(14.5px, 1.18vw, 16px);
  line-height: 1.58;
}

.gifting-hero-copy .btn-primary,
.gifting-detail-copy .btn-primary {
  margin-top: 20px;
}

.gifting-helper {
  margin-top: 10px !important;
  color: var(--muted-blue) !important;
  font-size: 13px !important;
  font-weight: 600;
}

.gifting-placeholder {
  min-height: 285px;
  border-radius: 28px;
  border: 1px dashed rgba(245,158,11,.42);
  background:
    radial-gradient(circle at 20% 18%, rgba(245,158,11,.14), transparent 30%),
    linear-gradient(135deg, #fffaf1, #fff);
  box-shadow: var(--shadow-card);
  display: grid;
  place-items: center;
  text-align: center;
  padding: 24px;
  color: var(--muted);
}

.gifting-placeholder strong {
  display: block;
  color: var(--midnight);
  font-size: 15px;
  margin-top: 9px;
}

.gifting-placeholder p {
  margin: 8px auto 0;
  max-width: 330px;
  font-size: 13.5px;
  line-height: 1.45;
}

.placeholder-icon {
  width: 58px;
  height: 58px;
  display: inline-grid;
  place-items: center;
  border-radius: 20px;
  background: var(--cream-2);
  box-shadow: inset 0 0 0 1px rgba(245,158,11,.16);
  font-size: 28px;
}

.gifting-soft-section,
.gifting-faq-section {
  background: #fff;
}

.gifting-bullets {
  margin: 16px 0 0;
  padding-left: 18px;
  color: var(--muted);
  font-size: 14.4px;
  line-height: 1.55;
}

.gifting-bullets li + li {
  margin-top: 7px;
}

.gifting-process-section .phone-stage {
  min-height: 500px;
}

.gifting-process-section .wa-messages {
  min-height: 335px;
}

@media (max-width: 920px) {
  .gifting-hero-grid,
  .gifting-detail-grid {
    grid-template-columns: 1fr;
  }

  .gifting-detail-grid.reverse .gifting-placeholder { order: 0; }

  .gifting-placeholder {
    min-height: 230px;
  }
}

@media (max-width: 640px) {
  .hero-mini-trust {
    font-size: 11px;
  }

  .story-note {
    font-size: 11px !important;
  }

  .sample-name-note {
    font-size: 11px !important;
  }

  .footer-socials {
    gap: 9px;
  }

  .gifting-hero-copy h1,
  .gifting-detail-copy h2 {
    font-size: clamp(28px, 8vw, 36px);
  }
}


/* v31 launch polish: contact layout + status pages */
.status-page-section .section-heading{max-width:760px}
.status-page-actions{justify-content:center}
@media (min-width:900px){
  .contact-section.simple-page-section{padding-top:clamp(30px,3vw,44px)}
  .contact-section .tight-heading{margin-bottom:22px}
  .contact-grid{gap:18px}
  .contact-card,.contact-form{padding:18px}
  .contact-card h2,.contact-form h2{font-size:22px;margin:12px 0 7px}
  .contact-card p{margin-bottom:14px}
  .contact-form{gap:9px}
  .contact-form label{gap:5px}
  .contact-form input,.contact-form textarea{padding:9px 12px}
  .contact-form textarea{min-height:94px}
}
@media (max-width:720px){
  .contact-section.simple-page-section{padding-top:34px}
  .contact-grid{gap:16px}
  .contact-card,.contact-form{padding:16px}
  .contact-card .btn-primary,.contact-form .btn-primary{width:100%;justify-content:center}
}

/* v32 contact page fit polish */
@media (min-width: 900px) {
  .contact-section.simple-page-section {
    padding-top: 24px;
    padding-bottom: 34px;
  }

  .contact-section .tight-heading {
    margin-bottom: 18px;
  }

  .contact-section .tight-heading h1 {
    font-size: clamp(36px, 3vw, 46px);
  }

  .contact-section .tight-heading p {
    margin-top: 8px;
    line-height: 1.45;
  }

  .contact-grid {
    max-width: 1120px;
    gap: 16px;
    align-items: start;
  }

  .contact-card,
  .contact-form {
    border-radius: 20px;
    padding: 16px 18px;
  }

  .contact-section .gift-icon {
    width: 42px;
    height: 42px;
    border-radius: 14px;
    font-size: 20px;
  }

  .contact-card h2,
  .contact-form h2 {
    font-size: 21px;
    margin: 10px 0 6px;
  }

  .contact-card p {
    margin: 0 0 12px;
    line-height: 1.45;
  }

  .contact-form {
    gap: 7px;
  }

  .contact-form label {
    gap: 4px;
  }

  .contact-form input,
  .contact-form textarea {
    padding: 8px 11px;
  }

  .contact-form textarea {
    height: 86px;
    min-height: 80px;
  }
}

@media (max-width: 720px) {
  .contact-section.simple-page-section {
    padding-top: 28px;
    padding-bottom: 36px;
  }

  .contact-section .tight-heading {
    margin-bottom: 18px;
  }

  .contact-grid {
    gap: 14px;
  }

  .contact-card,
  .contact-form {
    padding: 15px;
  }

  .contact-form textarea {
    height: 96px;
    min-height: 88px;
  }
}


/* v33 gifting page image placement */
.gifting-image-card {
  margin: 0;
  border-radius: 28px;
  overflow: hidden;
  border: 1px solid rgba(245, 158, 11, .22);
  background: #fff;
  box-shadow: var(--shadow-card);
  align-self: center;
}

.gifting-image-card img {
  display: block;
  width: 100%;
  height: auto;
}

.gifting-detail-grid.reverse .gifting-image-card {
  order: -1;
}

@media (max-width: 920px) {
  .gifting-detail-grid.reverse .gifting-image-card {
    order: 0;
  }
}

@media (max-width: 640px) {
  .gifting-image-card {
    border-radius: 22px;
  }
}

/* v35 public media protection deterrent */
img,
picture,
video,
canvas {
  -webkit-user-select: none;
  user-select: none;
  -webkit-user-drag: none;
  -webkit-touch-callout: none;
}

/* v36 footer logo alignment and gifting detail image fit polish */
.footer-brand {
  display: grid;
  justify-items: start;
  text-align: left;
}

.footer-logo-link {
  justify-self: start;
  margin-left: 0;
  margin-right: auto;
}

.gifting-detail-grid .gifting-image-card {
  width: min(100%, 420px);
  height: clamp(330px, 34vw, 430px);
  justify-self: center;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 10px;
}

.gifting-detail-grid .gifting-image-card img {
  width: auto;
  max-width: 100%;
  height: auto;
  max-height: 100%;
  object-fit: contain;
  border-radius: 22px;
}

@media (max-width: 640px) {
  .gifting-detail-grid .gifting-image-card {
    width: min(100%, 340px);
    height: 330px;
    padding: 8px;
  }
}

/* v37 CSS-only polish: footer logo box, gifting detail card fit, WhatsApp radiating glow */
.footer-logo {
  width: 78px;
  max-height: none;
  object-fit: contain;
  object-position: left center;
}

.footer-logo-link {
  width: auto;
  justify-self: start;
}

.gifting-detail-grid .gifting-image-card {
  width: min(100%, 390px);
  aspect-ratio: 1122 / 1402;
  height: auto;
  padding: 0;
  display: block;
  overflow: hidden;
  justify-self: center;
}

.gifting-detail-grid .gifting-image-card img {
  width: 100%;
  height: 100%;
  max-width: none;
  max-height: none;
  object-fit: cover;
  border-radius: inherit;
  display: block;
}

.floating-whatsapp {
  overflow: visible;
  box-shadow:
    0 18px 42px rgba(37, 211, 102, .34),
    0 0 0 12px rgba(37, 211, 102, .11),
    0 0 38px rgba(37, 211, 102, .22);
}

.floating-whatsapp::before {
  inset: -14px;
  border: 1px solid rgba(37, 211, 102, .42);
  box-shadow: 0 0 24px rgba(37, 211, 102, .18);
  animation: whatsappPulse 2.6s ease-out infinite;
}

@keyframes whatsappPulse {
  0% { transform: scale(.82); opacity: .64; }
  68% { transform: scale(1.52); opacity: 0; }
  100% { transform: scale(1.52); opacity: 0; }
}

@media (max-width: 640px) {
  .gifting-detail-grid .gifting-image-card {
    width: min(100%, 320px);
  }
}
