/* AYRE's plated desserts: one warm stage, seven photographed flavours. */
.dessert-section{--cocoa:#43271f;--cream:#fbf2e7;color:var(--cocoa);background:var(--cream);padding:40px var(--gutter) 88px;overflow:hidden}
.dessert-section>.section-line{max-width:1440px;margin:0 auto;border-bottom:1px solid #43271f26;padding-bottom:20px}
.dessert-section .section-line h2{font-size:13px}
.dessert-section .section-line>span{font-size:11px;letter-spacing:1.6px}
.dessert-hero{max-width:1440px;margin:0 auto;padding:26px 0 46px}
.dessert-switch{display:flex;justify-content:center}
.dessert-base{display:inline-flex;gap:8px;flex-shrink:0}
.dessert-base button{border:1px solid #43271f35;border-radius:28px;min-height:44px;padding:10px 24px;font-size:14px;white-space:nowrap;transition:background .2s,color .2s}
.dessert-base button.active{background:var(--cocoa);color:var(--cream);border-color:var(--cocoa)}
.dessert-base button:not(.active):hover{background:#43271f0a}
.dessert-composition{display:grid;grid-template-columns:29% 46% 25%;align-items:center;min-height:410px;position:relative}
.dessert-heading,.dessert-detail{position:relative;z-index:1}
.dessert-eyebrow{display:block;font-size:12px;font-weight:700;letter-spacing:2px;line-height:1.4}
.dessert-heading h2{font-size:clamp(45px,5.4vw,84px);letter-spacing:-.06em;line-height:.94;margin:17px 0 26px;white-space:nowrap}
.dessert-heading p{font-size:15px;line-height:1.6;max-width:220px}
.dessert-menu-link{display:inline-flex;gap:18px;align-items:center;font-size:13px;border-bottom:1px solid #43271f60;padding:12px 0;margin-top:21px}
.dessert-menu-link>span{font-size:20px}
.dessert-hero-art{position:relative;width:142%;aspect-ratio:3/2;margin-left:-21%;display:grid;place-items:center;pointer-events:none}
.dessert-hero-photo{display:block;width:100%;height:auto;mix-blend-mode:normal}
.dessert-hero-sprite{width:83%;aspect-ratio:1;display:block;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}
.dessert-photo{display:block;aspect-ratio:1;background-size:200% 200%;background-repeat:no-repeat;pointer-events:none}
.dessert-hero-sprite>.dessert-photo{width:100%;height:100%}
.dessert-hero-sprite-pancakes{width:72%}
.dessert-detail{border-left:1px solid #43271f33;padding-left:28px;margin-left:12px}
.dessert-detail .dessert-eyebrow{font-size:10px;letter-spacing:1.8px;opacity:.7}
.dessert-detail h3{font-size:clamp(24px,2.6vw,38px);line-height:1.06;letter-spacing:-1px;margin:16px 0}
.dessert-detail p{font-size:15px;line-height:1.65;max-width:255px;min-height:50px}
.dessert-detail strong{display:block;font-size:27px;font-weight:400;letter-spacing:-1px;margin-top:19px}
.dessert-full-menu{display:flex;align-items:center;justify-content:space-between;gap:30px;min-height:44px;font-size:13px;font-weight:700;border-bottom:1px solid #43271f60;margin-top:13px;padding:8px 0}
.dessert-controls{display:flex;justify-content:center;align-items:center;gap:16px;position:relative;z-index:2;margin-top:10px}
.dessert-arrow{display:grid;place-items:center;width:44px;height:44px;border:1px solid #43271f55;border-radius:50%;font-size:23px;flex-shrink:0}
.dessert-arrow:hover{background:#43271f0b}
.dessert-thumbnails{display:flex;gap:8px;max-width:680px;width:70%}
.dessert-thumbnails button{display:flex;align-items:center;gap:7px;flex:1;min-width:0;padding:3px 14px 3px 5px;border:1px solid #43271f24;border-radius:50px;min-height:64px;font-size:13px;text-align:left;transition:background .25s}
.dessert-thumbnails button.active{background:#f3d0c7;border-color:#e5b7aa}
.dessert-thumbnails .dessert-photo{width:60px;flex-shrink:0}
.dessert-thumbnails button>span:last-child{line-height:1.25}
.dessert-thumbnails button.active>span:last-child{text-decoration:underline;text-underline-offset:6px;text-decoration-thickness:1px}
.dessert-menu{max-width:1440px;margin:38px auto 0;border-top:1px solid #43271f26;padding-top:45px;scroll-margin-top:28px}
.dessert-menu-heading{display:flex;align-items:flex-end;justify-content:space-between;gap:24px}
.dessert-menu-heading h2{font-size:clamp(34px,4vw,58px);line-height:1.03;letter-spacing:-.045em;margin-top:17px}
.dessert-inclusion{font-size:14px;line-height:1.6;margin:25px 0 28px}
.dessert-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px}
.dessert-card{--dish-color:#ecdfce;background:var(--dish-color);border-radius:10px;overflow:hidden;display:flex;flex-direction:column}
.dessert-tone-pistachio{--dish-color:#e3e7cc}.dessert-tone-chocolate{--dish-color:#e9d3bc}.dessert-tone-cookies{--dish-color:#e4dbd3}.dessert-tone-berry{--dish-color:#f3d0c7}.dessert-tone-bueno{--dish-color:#efddc1}.dessert-tone-lotus{--dish-color:#ead0b8}.dessert-tone-mix{--dish-color:#e1dcc8}
.dessert-card-visual{aspect-ratio:1.38;position:relative;overflow:hidden}
.dessert-card-visual>.dessert-photo{position:absolute;width:100%;top:50%;left:50%;transform:translate(-50%,-50%)}
.dessert-card-visual>.dessert-photo-pancakes{width:85%}
.dessert-card-copy{padding:0 25px 25px;display:grid;grid-template-columns:1fr auto;column-gap:8px;flex:1}
.dessert-card-number{font-size:10px;letter-spacing:2px;opacity:.65;grid-column:1/-1;margin:3px 0 9px}
.dessert-card h3{font-size:24px;line-height:1.1;letter-spacing:-.6px;grid-column:1/-1}
.dessert-card p{font-size:14px;line-height:1.6;grid-column:1/-1;margin:12px 0 20px;max-width:330px}
.dessert-card strong{font-size:20px;font-weight:400;align-self:end;grid-column:1/-1}
.dessert-card-wide{grid-column:1/-1;display:grid;grid-template-columns:1fr 2fr;align-items:center}
.dessert-card-wide .dessert-card-visual{aspect-ratio:1.45}
.dessert-card-wide .dessert-photo-pancakes{width:83%}
.dessert-card-wide .dessert-card-copy{padding:28px 45px}
.dessert-card-wide h3{font-size:36px}.dessert-card-wide p{max-width:none}
.menu-item.dessert-menu-item{display:grid;grid-template-columns:100px 1fr auto;align-items:center;gap:18px}
.dessert-menu-item>.dessert-photo{width:100px}
.dessert-menu-item .menu-price{align-self:center}
@media(min-width:1550px){.dessert-composition{min-height:480px}.dessert-hero{padding-bottom:60px}}
@media(max-width:1050px){
 .dessert-composition{grid-template-columns:28% 45% 27%;min-height:375px}
 .dessert-heading h2{font-size:5.35vw}
 .dessert-detail{padding-left:20px;margin-left:4px}.dessert-detail h3{font-size:28px}
 .dessert-detail p,.dessert-heading p{font-size:14px}
 .dessert-thumbnails{width:80%}.dessert-thumbnails button{padding-right:10px}.dessert-thumbnails .dessert-photo{width:49px}
 .dessert-card-copy{padding:0 20px 23px}.dessert-card h3{font-size:21px}
}
@media(max-width:800px){
 .dessert-section{padding-top:30px;padding-bottom:50px}
 .dessert-section .section-line>span{display:none}
 .dessert-hero{padding-top:23px;padding-bottom:20px}
 .dessert-composition{grid-template-columns:1fr 1fr;min-height:0;gap:10px;margin-top:26px}
 .dessert-heading{grid-column:1/-1;display:grid;grid-template-columns:1fr auto;align-items:end;column-gap:20px}
 .dessert-heading .dessert-eyebrow{grid-column:1/-1}.dessert-heading h2{font-size:clamp(44px,8.5vw,65px);margin:10px 0 0}
 .dessert-heading p{font-size:13px;max-width:145px}.dessert-menu-link{display:none}
 .dessert-hero-art{grid-column:1;grid-row:2;width:154%;margin-left:-27%;margin-top:10px;margin-bottom:5px}
 .dessert-detail{grid-column:2;grid-row:2;padding-left:22px;margin-left:15px}.dessert-detail h3{font-size:28px}
 .dessert-detail p{font-size:14px}.dessert-detail strong{font-size:24px;margin-top:12px}
 .dessert-controls{gap:10px;margin-top:25px}.dessert-thumbnails{width:100%}.dessert-thumbnails button{font-size:12px;min-height:60px}.dessert-thumbnails .dessert-photo{width:40px}
 .dessert-menu{margin-top:30px;padding-top:30px}.dessert-menu-heading{align-items:flex-start;flex-direction:column;gap:24px}.dessert-menu-heading h2{font-size:40px}
 .dessert-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}.dessert-card-wide{grid-template-columns:1fr 1fr}.dessert-card-wide .dessert-card-copy{padding:24px}
}
@media(max-width:560px){
 .dessert-section{padding:27px 22px 44px}.dessert-section .section-line h2{font-size:11px;letter-spacing:.4px}
 .dessert-base button{padding:10px 21px;font-size:13px}
 .dessert-composition{display:flex;flex-direction:column;gap:0;margin-top:29px}
 .dessert-heading{display:block;text-align:center;width:100%}
 .dessert-heading h2{font-size:clamp(41px,11vw,61px);margin:9px 0 13px}
 .dessert-heading .dessert-eyebrow{font-size:10px}.dessert-heading p{max-width:none;font-size:13px}
 .dessert-hero-art{width:145%;margin:0;aspect-ratio:3/2}
 .dessert-detail{border-left:0;border-top:1px solid #43271f2b;margin:-14px 0 0;padding:21px 0 0;width:100%;display:grid;grid-template-columns:1fr auto;column-gap:16px;position:relative}
 .dessert-detail .dessert-eyebrow{grid-column:1/-1;font-size:10px;margin-bottom:9px}
 .dessert-detail h3{font-size:28px;margin:0;grid-column:1;grid-row:2}
 .dessert-detail strong{font-size:24px;margin:0;grid-column:2;grid-row:2;line-height:1.2;align-self:center}
 .dessert-detail p{grid-column:1/-1;font-size:14px;line-height:1.6;max-width:none;min-height:45px;margin-top:13px}
 .dessert-full-menu{grid-column:1/-1;justify-self:start;margin-top:10px;min-height:44px;padding-bottom:8px}
 .dessert-controls{margin-top:26px;gap:12px;max-width:370px;margin-left:auto;margin-right:auto}
 .dessert-thumbnails{width:auto;flex:1}.dessert-thumbnails button:not(.active){display:none}
 .dessert-thumbnails button{padding:0 14px 0 5px;min-height:58px;font-size:13px;gap:9px}.dessert-thumbnails .dessert-photo{width:58px}
 .dessert-menu{padding-top:29px;margin-top:32px}.dessert-menu-heading h2{font-size:38px}.dessert-menu-heading .dessert-eyebrow{font-size:10px}
 .dessert-menu-heading{gap:21px}.dessert-inclusion{font-size:13px;margin:18px 0 23px}
 .dessert-grid{grid-template-columns:1fr;gap:19px}.dessert-card-wide{display:flex;grid-column:auto}
 .dessert-card-visual,.dessert-card-wide .dessert-card-visual{aspect-ratio:1.3}
 .dessert-card-copy,.dessert-card-wide .dessert-card-copy{padding:0 23px 25px}
 .dessert-card h3,.dessert-card-wide h3{font-size:27px}.dessert-card p{font-size:15px;line-height:1.6;margin-bottom:20px}.dessert-card strong{font-size:23px}
 .menu-item.dessert-menu-item{grid-template-columns:78px 1fr;gap:10px 14px;align-items:start}
 .dessert-menu-item>.dessert-photo{width:78px;grid-row:1/3;align-self:center}
 .dessert-menu-item .menu-price{grid-column:2;font-size:16px;justify-self:start;text-align:left}
 .dessert-menu-item h3{font-size:18px}.dessert-menu-item p{font-size:13px}
}
@media(prefers-reduced-motion:reduce){.dessert-base button,.dessert-thumbnails button{transition:none}}
