/* Phone-only art direction. Remove this stylesheet and mobile.js to revert.
   Content remains owned by content.json; no duplicate photo/copy data. */
@media(max-width:760px){
 :root{--gutter:22px}
 .cover{height:94svh;min-height:650px;max-height:880px;display:block;background:#4d6a77;border-radius:0 0 28px 28px}
 .cover-image{position:absolute;inset:0;width:100%;height:100%;aspect-ratio:auto;object-fit:cover;object-position:56% 60%;z-index:-2}
 .cover:after{display:block;background:linear-gradient(180deg,#1737432b,transparent 40%,transparent 72%,#17374380)}
 .cover-heading{position:absolute;top:85px;left:0;right:0;width:100%;padding:0 20px;text-align:center}
 .cover-heading .eyebrow{font-size:9px;letter-spacing:.13em;margin-bottom:6px}
 .cover-heading h1{width:92%;max-width:430px;margin:0 auto;aspect-ratio:10/3}
 .cover-heading p{font-size:clamp(10px,2.65vw,11px);line-height:1.85;margin:10px 0 0 clamp(0px,calc((100vw - 320px) * .2),16px);max-width:46%;text-align:left}
 .cover-bottom{position:absolute;inset:auto 22px 22px;padding:0;font-size:9px;align-items:center}
 .cover-bottom a{padding:8px 12px;border:1px solid #ffffff66;border-radius:24px}
 .site-header{height:65px;padding:0 22px}.menu-toggle{font-size:10px}
 .hello{padding-top:44px}.hello-layout{gap:25px;margin:28px 0 38px}
 .hello-copy h2{font-size:27px;line-height:1.6}.hello-copy>p{font-size:13px;line-height:1.95}
 .hello-photo .photo-button{border-radius:120px 120px 8px 8px}
 .hello-photo{width:85%;justify-self:center}
 .hello-photo img{aspect-ratio:1.06;object-fit:cover}
 .hello-photo figcaption{justify-content:center;font-size:9px;letter-spacing:.12em}
 .profile-switch{display:flex;gap:8px;padding:5px;border-radius:50px;background:#e4ecec;margin:0 0 22px}
 .profile-switch button{flex:1;border:0;border-radius:30px;background:transparent;padding:12px 10px;font-size:16px;font-weight:600;min-height:48px}
 .profile-switch button[aria-selected=true]{background:var(--ink);color:white;box-shadow:0 3px 8px #18354320}
 .profile-switch button span{font-size:10px;margin-left:9px;font-weight:400}
 .profiles.phone-profiles{display:block}
 .phone-profiles .profile[hidden]{display:none}
 .phone-profiles .portrait{border-radius:12px;overflow:hidden}
 .phone-profiles .portrait img{aspect-ratio:1.08;object-fit:cover}
 .phone-profiles .profile-text{padding-top:20px}
 .phone-profiles .profile-text>p{font-size:14px;line-height:1.95;min-height:82px}
 .profile-name h3{font-size:46px}.portrait-tag{font-size:9px}
 .journal{border-radius:28px 28px 0 0;padding-top:38px;padding-bottom:44px}
 .journal .section-label{border-bottom:0;padding-bottom:0}
 .journal-layout.phone-journal{display:block;margin-top:24px}
 .moment-reel{display:flex;gap:14px;overflow-x:auto;scroll-snap-type:x mandatory;scroll-padding:22px;margin:0 -22px;padding:8px 22px 15px;scrollbar-width:none;overscroll-behavior-x:contain}
 .moment-reel::-webkit-scrollbar{display:none}
 .moment-reel>figure{flex:0 0 88%;width:auto;margin:0;scroll-snap-align:start;min-width:0}
 .moment-reel .photo-button{border-radius:12px}
 .moment-reel img{width:100%;height:auto;aspect-ratio:3/4;object-fit:cover}
 .moment-reel figcaption{font-size:10px;margin-top:9px}
 .reel-controls{display:flex;align-items:center;justify-content:space-between;margin:0 0 32px;font-size:10px;letter-spacing:.04em;color:#dce8ed}
 .reel-controls .reel-dots{display:flex;gap:0}
 .reel-dots button{width:32px;height:44px;background:none;border:0;padding:0;display:grid;place-items:center}
 .reel-dots button:after{content:'';width:5px;height:5px;border-radius:50%;background:#ffffff55;transition:width .2s}
 .reel-dots button[aria-current=true]:after{width:21px;background:var(--yellow);border-radius:4px}
 .journal .journal-note{padding:8px 0 10px;margin:0;text-align:center;align-items:center}
 .journal-note p{font-size:25px;line-height:1.9}
 .tiktok-cta{margin-top:28px;padding-top:24px;grid-template-columns:65px 1fr;gap:18px}
 .tiktok-cta-action{font-size:31px;margin:4px 0 8px}.tiktok-cta-copy{font-size:11px}
 .heritage{padding-top:40px;padding-bottom:44px}
 .heritage .heritage-layout{gap:22px;margin-top:26px}
 .heritage .heritage-copy{order:0}
 .heritage .heritage-copy h2{font-size:27px}.heritage .heritage-photo{order:2;width:56%;align-self:flex-end;border-radius:8px;overflow:hidden}
 .heritage .heritage-detail{order:1;margin-top:0}
 .heritage .heritage-detail>.photo-button{border-radius:10px;aspect-ratio:3/2;background:#d6e3e8}
 .heritage .heritage-detail>.photo-button img{height:100%;object-fit:contain}
 .occasion{padding-block:44px}.occasion-head h2{font-size:26px}
 .occasion-photos{gap:18px}.occasion-photos .photo-button{border-radius:10px}
 .occasion .occasion-photos figure:nth-child(2){width:76%}
 .outside{position:relative;background:var(--yellow)}
 .outside-copy{padding:30px 22px 36px}.outside-copy h2{font-size:28px}
 .outside-photo img{aspect-ratio:1.1}
 .years{padding-block:44px}.year-previews{gap:24px 14px}
 .year-preview img{border-radius:9px;aspect-ratio:1;object-fit:cover}
 .year-preview span{font-size:29px}.year-preview:nth-child(even){padding-top:24px}
 .memory{padding-block:42px;gap:24px;background:#e3edf0}
 .memory-photo{order:-1;width:100%;justify-self:center;transform:none;border:0;border-radius:10px;overflow:hidden;box-shadow:none}
 .memory-photo img{aspect-ratio:1;object-fit:contain;background:white}
 .memory-photo figcaption{display:none}.memory-copy{text-align:center}
 .memory-copy .eyebrow{font-size:9px}.memory-copy h2{font-size:27px;margin:13px 0;line-height:1.5}
 .memory-copy h2 br{display:none}.memory-copy>p{margin:10px 0 20px;font-size:13px}
 .memory-copy .pill{background:var(--ink);color:white;border:0;gap:30px}
 .footer-top p{font-size:20px}.footer-mark{margin:30px auto}
 .photo-button:active img{transform:scale(.985)}
 .phone-journal .reveal,.phone-profiles .reveal{opacity:1!important;translate:none!important}
 .lightbox figure{touch-action:pan-y}
}
@media(max-width:360px){.cover-heading{top:72px}.cover-heading p{font-size:10px}.section-label{font-size:9px}.hello-copy h2{font-size:25px}.occasion-head h2{font-size:23px}}
@media(max-width:760px) and (prefers-reduced-motion:reduce){.photo-button:active img{transform:none}.memory-photo{transform:none}}
@media(max-width:760px){
 .heritage .has-phone-coat>.heritage-photo,.heritage .has-phone-coat>.heritage-detail{display:none}
 .phone-coat-shell{order:1;width:100%;min-width:0}
 .occasion-photos[hidden]{display:none}
 .phone-photo-reel{display:flex;gap:14px;overflow-x:auto;scroll-snap-type:x mandatory;scroll-padding:22px;margin-inline:-22px;padding:4px 22px 12px;scrollbar-width:none;overscroll-behavior-x:contain}
 .phone-photo-reel::-webkit-scrollbar{display:none}
 .phone-photo-reel>figure{flex:0 0 91%;min-width:0;margin:0;scroll-snap-align:start}
 .phone-photo-reel .photo-button{border-radius:10px;background:#d6e3e8;aspect-ratio:4/5}
 .phone-photo-reel img{width:100%;height:100%;aspect-ratio:auto;object-fit:contain}
 .wedding-reel .photo-button{background:#efeae7;aspect-ratio:3/4}
 .coat-reel{align-items:flex-start;transition:height .25s ease}
 .coat-reel .photo-button{aspect-ratio:auto;background:transparent}
 .coat-reel img{height:auto;max-height:65svh;object-fit:contain}
 @media(prefers-reduced-motion:reduce){.coat-reel{transition:none}}
 .phone-photo-reel figcaption{font-size:11px;margin:10px 0 0}
 .phone-reel-controls{display:flex;align-items:center;justify-content:space-between;gap:10px;font-size:10px;margin-top:2px}
 .phone-reel-controls>div{display:flex;align-items:center;gap:6px}
 .phone-reel-count{font-size:11px;font-variant-numeric:tabular-nums;margin-right:8px;white-space:nowrap}
 .phone-reel-controls button{width:44px;height:44px;border:1px solid #18354330;border-radius:50%;background:transparent;font-size:18px}
 .phone-reel-controls button:disabled{opacity:.3;cursor:default}
 .phone-photo-reel .reveal{opacity:1!important;translate:none!important}
}
/* Landscape keeps copy in the wall space beside the two dogs. */
@media(max-width:760px) and (orientation:landscape){
 .cover{height:580px;min-height:580px;max-height:none}
 .cover-heading{top:92px;left:22px;right:auto;width:44%;padding:0;text-align:left}
 .cover-heading h1{width:100%;margin:0 0 0 -16px;max-width:none}
 .cover-heading p{font-size:12px;margin-top:20px;max-width:240px}
 .cover-image{object-position:56% 58%}
}
@media(max-width:760px){
 .large-mobile-copy .cover{height:auto;min-height:0;max-height:none;display:flex}
 .large-mobile-copy .cover-heading{position:relative;inset:auto;width:100%;padding:90px 22px 24px;text-align:left}
 .large-mobile-copy .cover-heading p{max-width:none}
 .large-mobile-copy .cover-image{position:relative;inset:auto;height:auto;aspect-ratio:1;z-index:0}
 .large-mobile-copy .cover-bottom{position:relative;inset:auto;padding:20px 22px;flex-wrap:wrap}
}
