/* Tablet: preserve the mobile reading order while using the available width. */
@media (min-width:600px) and (max-width:1023px){
 body{max-width:720px;width:100%;box-shadow:none;margin:0 auto}
 .hero-collage{height:450px}
 .hero-person{width:90%;left:5%;top:-38px}
 .hero-star{width:108%;left:-4%;top:24px}
 .hero h1{font-size:64px}
 .hero p{font-size:23px}
 .hero .ticker{margin-top:25px;padding-top:18px;padding-bottom:18px;font-size:18px}
 .sale-clock{margin:32px 30px 48px;padding:32px}
 .sale-clock h2{font-size:42px}
 .sale-clock #clock-title{font-size:18px}
 .clock-digits{gap:14px}
 .clock-digits b{font-size:44px}
 .programs{padding-right:30px;padding-left:30px}
 .offer .offer-cover{height:650px;padding:32px 34px 0}
 .offer .offer-cover::before{height:425px}
 .offer .offer-cover h3{font-size:50px}
 .offer .art-scene{top:205px;height:460px;left:-30px;right:-30px}
 .offer .offer-body{padding:45px 34px 32px}
 .offer .topic-tags span{font-size:16px}
 .offer .price{font-size:44px}
 .offer .next-price{left:calc(50% + 115px)}
 .offer .next-price b{font-size:18px}
 .offer .price-line{margin-top:10px}
 .offer .btn{font-size:19px;min-height:59px}
 .yellow .offer-cover{height:590px}
 .yellow .art-scene{top:157px;height:470px}
 .yellow .offer-cover::before{height:370px}
 .pro{margin-left:30px;margin-right:30px}
 .pro .offer-cover{height:650px}
 .pro .art-scene{top:210px;height:470px}
 .raffle-teaser{margin-left:-30px;margin-right:-30px;padding:36px 40px}
 .raffle-teaser h2{font-size:43px}
 .raffle-art{height:360px}
 .webinar-banner{padding:36px}
 .webinar-banner h2{font-size:38px}
 .webinar-window{height:340px}
 .webinar-window>img{height:350px}
 .gift-finale{padding:42px 40px}
 .gift-finale>h2{font-size:52px}
 .gift-finale .finale-art{height:390px}
 .gift-pro{margin-left:-40px;margin-right:-40px;padding-left:40px;padding-right:40px}
 .site-footer{padding-left:40px;padding-right:40px}
}

/* Desktop: a campaign poster followed by paired product and purchase columns. */
@media (min-width:1024px){
 body{max-width:none;width:100%;margin:0;box-shadow:none;padding-bottom:0}
 .hero{display:grid;grid-template-columns:1.2fr 1fr;grid-template-rows:1fr auto auto;column-gap:24px;max-width:1280px;min-height:540px;margin:0 auto;padding:28px 48px 0;overflow:hidden;text-align:left}
 .hero-collage{grid-column:2;grid-row:1 / 3;align-self:end;width:100%;height:480px;margin:0;overflow:hidden}
 .hero-person{width:114%;left:-7%;top:3px}
 .hero-star{width:126%;left:-13%;top:30px}
 .hero h1{grid-column:1;grid-row:1;align-self:end;font-size:clamp(64px,6.1vw,88px);line-height:.99;letter-spacing:-.04em;margin:0;padding:0;background:transparent;text-align:left}
 .hero>p{grid-column:1;grid-row:2;align-self:start;font-size:23px;line-height:1.45;margin:25px 0 72px;max-width:490px}
 .hero .ticker{grid-column:1 / -1;grid-row:3;align-self:end;display:flex;justify-content:center;gap:38px;width:calc(100% + 96px);margin:0 -48px 14px;min-height:59px;padding:17px 30px;font-size:18px;transform:rotate(-1deg)}
 main{max-width:1280px;margin:0 auto}
 .sale-clock{display:grid;grid-template-columns:1fr 1fr;column-gap:35px;align-items:center;width:calc(100% - 96px);margin:38px 48px 72px;padding:30px 48px;text-align:left;border-radius:24px}
 .sale-clock h2{grid-column:1;grid-row:1 / 3;font-size:43px;line-height:1.07;max-width:380px;margin:0}
 .sale-clock #clock-title{grid-column:2;grid-row:1;margin:0 0 12px;text-align:center;font-size:17px}
 .sale-clock .clock-digits{grid-column:2;grid-row:2;gap:13px;width:100%}
 .clock-digits b{font-size:42px}
 .clock-digits>span{min-width:57px}
 .clock-digits i{font-size:37px}
 .clock-digits small{font-size:13px}
 .programs{padding:0 48px}
 .offer{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:32px;background:#fffdf8;border-radius:24px;margin:0 0 72px;overflow:visible}
 .offer .offer-cover{position:sticky;top:24px;align-self:start;width:100%;min-height:0;height:600px;padding:30px 30px 0}
 .offer .offer-cover::before{height:385px;border-radius:24px 24px 45% 8%}
 .offer .offer-cover h3{font-size:clamp(39px,3.8vw,49px);line-height:1.05;max-width:100%;text-wrap:initial}
 .offer-cover .flag{font-size:14px;margin-top:18px}
 .offer .art-scene{top:185px;left:-18px;right:-18px;height:400px}
 .offer .art-scene img{width:132%;left:-16%}
 .offer .offer-body{z-index:1;align-self:start;background:transparent;border-radius:0;padding:30px 30px 32px 0}
 .offer .offer-body>p:first-child{font-size:20px;line-height:1.5;margin-top:0}
 .offer .format-line{font-size:16px;margin-top:19px}
 .offer .topic-tags{gap:8px;margin:20px 0}
 .offer .topic-tags span{font-size:14px;padding:8px 10px}
 .offer .topic-tags .support-chip{font-size:16px;padding:12px 14px}
 .support-chip small{font-size:14px}
 .program-more{margin-top:20px}
 .program-more summary{font-size:16px;padding:17px 30px 17px 0}
 .expanded p,.expanded li{font-size:17px!important}
 .offer .price-caption{font-size:12px;margin-top:23px}
 .offer .price-line{margin-top:5px;padding:0 65px}
 .offer .price{font-size:43px;left:-8px}
 .offer .next-price{left:calc(50% + 104px);top:4px}
 .offer .btn{font-size:18px;min-height:56px}
 .offer .bank{font-size:16px}
 .offer .bank small,.dolyami-amount{font-size:14px}
 .blue .offer-cover::before{border-radius:24px 24px 8% 44%}
 .blue .offer-cover h3{font-size:clamp(36px,3.55vw,46px)}
 .blue .art-scene{top:218px;height:375px}
 .blue .art-scene img{width:143%;left:-21.5%}
 .yellow .offer-cover{height:565px}
 .yellow .offer-cover::before{height:345px}
 .yellow .art-scene{top:147px;height:400px}
 .yellow .art-scene img{width:137%;left:-16%}
 .pro-gap{padding:43px 40px;margin:80px 48px 37px;border-radius:0;background:#e9dcf5;text-align:center}
 .pro-gap .star{font-size:45px}
 .pro-gap h2{font-size:42px;line-height:1.15;margin:14px 0}
 .pro-gap p{font-size:19px;line-height:1.5;margin:0}
 .pro{margin:0 48px 80px;border:0}
 .pro .offer-cover{height:600px}
 .pro .offer-cover::before{height:390px;border-radius:24px 24px 9% 43%}
 .pro .art-scene{top:205px;height:395px}
 .pro .art-scene img{width:144%;left:-22%}
 .raffle-teaser{display:grid;grid-template-columns:1fr 1fr;column-gap:32px;align-items:start;margin:0 0 72px;padding:38px 40px 36px;border-radius:24px;overflow:hidden}
 .raffle-teaser h2{grid-column:1;grid-row:1;font-size:42px;line-height:1.12;margin:0 0 18px}
 .raffle-teaser>p{grid-column:1;grid-row:2;font-size:18px;max-width:440px;margin:0}
 .raffle-teaser .raffle-art{grid-column:2;grid-row:1 / 5;height:370px;align-self:center;margin:0 -40px 0 -12px}
 .raffle-ticket{left:12px;bottom:10px}
 .raffle-prizes{grid-column:1;grid-row:3;gap:16px;margin:24px 0}
 .raffle-prizes p{font-size:18px}
 .raffle-prizes span{font-size:14px}
 .raffle-teaser>a{grid-column:1;grid-row:4;max-width:none;font-size:16px}
 .raffle-teaser .popper{right:22px;bottom:20px}
 .webinar-banner{display:grid;grid-template-columns:1.1fr 1fr;column-gap:40px;align-items:start;margin:0 0 72px;padding:40px;border-radius:24px}
 .webinar-banner h2{grid-column:1;grid-row:1;font-size:38px;line-height:1.15}
 .webinar-date{grid-column:1;grid-row:2;font-size:17px;margin:23px 0}
 .webinar-window{grid-column:2;grid-row:1 / 4;height:310px;margin:0;align-self:center}
 .webinar-window>img{height:310px;transform:scale(1.15)}
 .webinar-banner>p:last-child{grid-column:1;grid-row:3;font-size:18px;max-width:440px}
 .gift-finale{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:0 48px;align-items:start;margin:0 48px;padding:44px 40px 40px;border-radius:32px 32px 0 0}
 .gift-finale>h2{grid-column:1;grid-row:1;font-size:53px;line-height:1.03;margin:0}
 .gift-finale>.gift-intro{grid-column:1;grid-row:2;font-size:18px;max-width:420px;margin:22px 0 35px}
 .gift-finale .finale-art{grid-column:2;grid-row:1 / 3;height:310px;margin:-10px -40px 10px -35px;align-self:center}
 .gift-group{grid-column:1;grid-row:3;padding:25px 0}
 .gift-pro{grid-column:2;grid-row:3;margin:0;padding:25px 25px 22px;border-radius:16px;transform:rotate(0)}
 .gift-finale h3{font-size:28px}
 .gift-finale p{font-size:16px;line-height:1.5}
 .prize-line{gap:17px;padding:17px 0}
 .prize-line b{font-size:49px}
 .prize-line span{font-size:22px}
 .gift-pro .prize-line span{font-size:18px}
 .gift-how{grid-column:1;grid-row:4;padding:20px 0 0}
 .gift-how h3{font-size:26px}
 .gift-cta{grid-column:2;grid-row:4;align-self:center;font-size:17px;margin:25px 0 0}
 .site-footer{display:grid;grid-template-columns:1fr 1fr;gap:30px 80px;padding:48px max(48px,calc((100vw - 1104px)/2)) 38px;text-align:left}
 .footer-brand{grid-column:1;grid-row:1;font-size:36px}
 .footer-nav{grid-column:2;grid-row:1;margin:0}
 .footer-contact{grid-column:1;grid-row:2;margin:0}
 .footer-legal{grid-column:2;grid-row:2;margin:0;align-content:start}
 .footer-copy{grid-column:1 / -1;grid-row:3;margin:0;padding-top:24px;border-top:1px solid #ccbdbd}
 .help-widget{right:25px;bottom:25px}
 .help-toggle{font-size:16px;padding:14px 19px}
}

@media (min-width:1024px) and (max-width:1150px){
 .hero{padding-left:36px;padding-right:36px;column-gap:12px}
 .hero h1{font-size:64px}
 .hero-collage{height:440px}
 .hero>p{font-size:21px;margin-bottom:65px}
 .hero .ticker{margin-left:-36px;width:calc(100% + 72px)}
 .sale-clock{padding:28px 35px;column-gap:20px}
 .sale-clock h2{font-size:39px}
 .offer{gap:24px}
 .offer .offer-cover{padding-left:25px;padding-right:25px;height:575px}
 .offer .offer-body{padding-right:25px}
 .offer .offer-cover h3{font-size:39px}
 .blue .offer-cover h3{font-size:36px}
 .offer .art-scene{height:375px}
 .blue .art-scene{height:350px}
 .offer .price{font-size:36px;left:-11px}
 .offer .next-price{left:calc(50% + 78px)}
 .raffle-teaser h2{font-size:36px}
 .webinar-banner h2{font-size:33px}
 .gift-finale{gap:0 30px;padding-left:32px;padding-right:32px}
 .gift-finale>h2{font-size:46px}
 .gift-pro{padding-left:20px;padding-right:20px}
}
