/* One viewport-sized scene, with a separate portrait composition. */
.hero{height:100svh;min-height:0;overflow:visible}.art{inset:0;aspect-ratio:auto;overflow:visible;mask-image:none}.art>img{object-fit:contain}.composition-stage{max-width:100%}.copy{top:18%}.bottom{bottom:12px}header>a:last-child{min-height:44px;display:inline-flex;align-items:center}footer{flex-wrap:wrap}footer a{min-height:44px;display:inline-flex;align-items:center}.whatsapp{font-size:inherit}.copy>a{min-height:44px}
@media(max-width:700px),(max-width:900px) and (orientation:portrait){.hero{height:100svh;min-height:calc(320px + 56.28vw)}.art{left:0;right:0;top:300px;bottom:20px;aspect-ratio:auto;mask-image:none}.art svg{width:100%;height:100%}.copy{left:6%;right:6%;top:110px;max-width:none}.copy>p{font-size:7px;line-height:1.7;margin-bottom:20px}h1{font-size:clamp(36px,10.5vw,76px);margin-bottom:18px}.copy>a{font-size:11px}.bottom{position:relative;left:auto;right:auto;bottom:auto;padding:12px 6%;margin-top:0}.hero:has(.bottom){padding-bottom:0}header{padding:26px 6%}header img{width:145px}header>a:last-child{font-size:10px}}
@media(min-width:701px) and (max-height:600px) and (orientation:landscape){.copy{top:22%}h1{font-size:clamp(32px,3.7vw,60px)}header{padding-top:16px}.copy>p{margin-bottom:12px}h1{margin-bottom:15px}}

header{gap:16px}header>a:first-child{margin-right:auto}header .whatsapp{font-size:10px;letter-spacing:.04em;min-height:44px;display:inline-flex;align-items:center}@media(max-width:700px){header{gap:12px}header .whatsapp{font-size:0}header .whatsapp:after{content:"WhatsApp";font-size:10px}}

header>a:nth-child(2){font-size:10px;letter-spacing:.1em;min-height:44px;display:inline-flex;align-items:center;white-space:nowrap}header .whatsapp{white-space:nowrap}@media(max-width:700px),(max-width:900px) and (orientation:portrait){header{flex-wrap:wrap;justify-content:flex-end}header>a:first-child{flex-basis:100%;height:34px}header .whatsapp,header>a:last-child.whatsapp{font-size:10px}header .whatsapp:after{content:none}.copy{top:145px}.art{top:320px}}

@media(max-width:700px),(max-width:900px) and (orientation:portrait){.bottom{position:absolute;left:6%;right:6%;bottom:10px;padding:0}.hero{min-height:calc(400px + 56.28vw)}}

html{min-height:100%}body{min-height:100svh;display:flex;flex-direction:column}main{flex:1;display:flex;flex-direction:column}.hero{flex:1;height:auto;min-height:420px}@media(max-width:700px),(max-width:900px) and (orientation:portrait){.hero{min-height:calc(400px + 56.28vw)}}@media(max-height:600px) and (orientation:landscape){.hero{min-height:260px}.art{inset:0}.copy{top:24%;left:5%;max-width:34%}h1{font-size:clamp(26px,3.7vw,50px)}header{padding:10px 5%;flex-wrap:nowrap}header>a:first-child{flex-basis:auto}.copy>p{font-size:6px;margin-bottom:10px}.copy>a{min-height:34px}h1{margin-bottom:12px}}

/* Draw arrows consistently, including on iOS emoji keyboards. */
.arrow-icon{display:inline-block;width:1em;height:1em;flex:none;vertical-align:-.1em}a .arrow-icon{margin-left:.3em}.copy>a>span{display:inline-flex}.copy>a>span .arrow-icon{margin-left:0}

/* V3: compact portrait flow; artwork retains its original aspect ratio. */
@media(max-width:700px),(max-width:900px) and (orientation:portrait){
 .hero{display:flex;flex-direction:column;min-height:calc(310px + 56.28vw)}
 header{position:relative;inset:auto;display:grid;grid-template-columns:minmax(0,1fr) auto;grid-template-rows:32px 32px;column-gap:12px;row-gap:0;padding:18px 6% 8px;flex:none;order:0}
 header>a:first-child{grid-column:1;grid-row:1/3;align-self:center;display:block;flex-basis:auto;height:auto;margin:0}
 header img{width:clamp(120px,34vw,145px)}
 header>a:nth-child(2),header>a:last-child.whatsapp{grid-column:2;min-height:32px;font-size:10px;justify-content:flex-end}
 header>a:nth-child(2){grid-row:1}header>a:last-child.whatsapp{grid-row:2}
 .copy{position:relative;inset:auto;order:1;flex:none;max-width:none;margin:12px 6% 0}
 .copy>p{margin:0 0 14px;line-height:1.7}
 h1{margin:0 0 14px}.copy>a{min-height:44px;padding-bottom:9px}
 .art{position:relative;inset:auto;order:2;flex:1 0 auto;width:100%;min-height:56.28vw;aspect-ratio:auto;margin-top:12px}
 .art>svg,.art>img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain}
 .art .composition-stage{max-width:100%}
 .bottom{position:relative;inset:auto;order:3;margin:0;padding:8px 6%;flex:none}
 footer{gap:2px 12px;padding:8px 6%}footer a{min-height:40px}
}

/* Retain the V2 desktop CTA line box when replacing the font arrow. */
@media(min-width:901px),(min-width:701px) and (orientation:landscape){.copy>a{height:51px}}

/* Header contacts share one clean baseline with the logo. */
@media(max-width:700px),(max-width:900px) and (orientation:portrait){
 header{display:grid;grid-template-columns:minmax(0,1fr) auto auto;grid-template-rows:44px;align-items:center;column-gap:clamp(8px,2.4vw,16px);padding:18px 6% 8px}
 header>a:first-child{grid-column:1;grid-row:1;align-self:center}
 header>a:nth-child(2){grid-column:2;grid-row:1;min-height:44px;font-size:clamp(8px,2.25vw,10px)}
 header>a:last-child.whatsapp{grid-column:3;grid-row:1;min-height:44px;font-size:clamp(8px,2.25vw,10px)}
 header img{width:clamp(105px,30vw,145px)}
 footer{gap:0 12px;padding:6px 6%}footer a{min-height:36px}
}

/* Match the case of both header contact labels. */
header .whatsapp{text-transform:uppercase;letter-spacing:.1em}
@media(max-width:700px),(max-width:900px) and (orientation:portrait){footer{display:flex;flex-wrap:nowrap;justify-content:space-between;align-items:center;gap:8px;font-size:clamp(6px,1.7vw,9px)}footer>*{white-space:nowrap}footer>span:last-of-type{display:inline;flex-basis:auto}footer a{min-height:36px}}

footer .instagram-link{display:inline-flex;justify-content:center;flex:none;width:24px;min-width:24px}footer .instagram-link svg{display:block;width:14px;height:14px}@media(max-width:360px){footer{gap:5px}footer .instagram-link{width:20px;min-width:20px}}