/* Size each composition to the available viewport, without cropping content. */
:root{--header-height:82px;--section-room:calc(100svh - var(--header-height));--hero-room:var(--section-room);--section-pad:clamp(20px,4svh,58px)}
html{scroll-padding-top:var(--header-height)}
.nav-row{height:clamp(64px,9svh,92px)}
.main-nav{top:100%}
.hero{min-height:var(--hero-room);padding-block:clamp(16px,3svh,40px);gap:clamp(20px,3vw,48px);align-content:center}
.hero h1{font-size:clamp(2rem,min(5.25vw,7.5svh),5.2rem);margin-block:clamp(12px,2svh,24px);line-height:1.06}
.hero h1>span{display:block}
.hero-description{font-size:1rem;line-height:1.65;max-width:490px}
.hero-actions{margin-top:clamp(16px,2.7svh,28px)}
.hero-proof{margin-top:clamp(16px,2.7svh,30px)}
.hero-art{height:calc(var(--hero-room) - clamp(32px,6svh,80px));min-height:0;max-height:720px;align-self:center;justify-content:center;margin:0}
.art-stage{width:min(100%,calc(var(--hero-room) - clamp(70px,12svh,130px)));max-height:100%;flex:none;margin:0;aspect-ratio:1;border-radius:50%}
.origin-label{top:clamp(0px,2svh,22px);left:0}
.route-label{bottom:clamp(20px,4svh,44px);right:0}
.art-caption{bottom:0}
.section{padding-block:var(--section-pad)}
.section-heading{gap:clamp(24px,4vw,70px);margin-bottom:clamp(20px,3.5svh,42px)}
.section-heading .eyebrow{margin-bottom:clamp(12px,2svh,22px)}
.massimo-layout{padding-block:var(--section-pad)}
.contact-section{gap:clamp(28px,5vw,80px)}
@media(min-width:1000px){
  #enfoque,.product-section>.section,.process-section,.massimo-layout,.contact-section{min-height:var(--section-room);align-content:center}
  .product-section>.section{min-height:calc(var(--section-room) - 2px)}
  h2{font-size:clamp(1.8rem,min(3.6vw,5svh),3.25rem)}
  .solution-card{padding:clamp(20px,3svh,32px)}
  .card-top{margin-bottom:clamp(14px,2.5svh,28px)}
  .clay-icon{width:clamp(42px,7svh,65px);height:clamp(42px,7svh,65px);border-radius:18px}
  .solution-card h3{margin-bottom:12px}
  .solution-card p{margin-bottom:16px;line-height:1.6}
  .section-footnote{margin-top:clamp(16px,2.5svh,28px)}
  .categories-layout{grid-template-columns:1fr 1.16fr;align-items:stretch}
  .coffee-feature{min-height:0}
  .category-list{gap:clamp(12px,2svh,17px)}
  .category-card{padding:clamp(16px,2.8svh,25px) 22px}
  .category-bottom{margin-top:clamp(12px,2svh,24px)}
  .process-list{margin-top:clamp(24px,4svh,45px)}
  .step-disc{margin-bottom:clamp(18px,3svh,27px)}
  .massimo-layout{gap:clamp(32px,5vw,75px)}
  .massimo-copy h2{font-size:clamp(2rem,min(4vw,5.7svh),3.7rem);margin-bottom:clamp(16px,2.5svh,26px)}
  .massimo-wordmark{font-size:clamp(1.3rem,3svh,1.8rem);margin-block:clamp(12px,2.4svh,26px)}
  .massimo-copy>p:not(.eyebrow){max-width:520px;line-height:1.6}
  .massimo-photo{min-height:0;height:100%;max-height:calc(var(--section-room) - 2 * var(--section-pad));align-self:stretch}
  .contact-copy h2{margin-bottom:clamp(16px,2.7svh,26px)}
  .contact-card{padding:clamp(22px,3.5svh,36px)}
  .contact-card>.clay-icon{margin-bottom:clamp(14px,2.5svh,25px)}
  .contact-card ul{margin-block:clamp(14px,2.5svh,24px)}
  .contact-card li{padding-block:clamp(8px,1.5svh,13px)}
  .future-note{margin-top:clamp(20px,3svh,35px)}
}
@media(min-width:721px) and (max-height:720px){
  .hero h1{font-size:clamp(2rem,min(4.6vw,7svh),3.1rem);letter-spacing:-.05em}
  .hero .eyebrow{font-size:.75rem;letter-spacing:.05em}
  .hero-actions{gap:18px}
  .hero-actions .button{min-height:48px;padding:12px 18px;font-size:.875rem}
  .hero-proof{margin-top:16px}
  .origin-label{padding:10px 13px}
  .route-label{padding:14px 19px;width:215px}
  .art-stage{width:min(100%,calc(var(--hero-room) - 38px))}
}
@media(min-width:1000px) and (max-height:720px){
  :root{--section-pad:20px}
  h2{font-size:clamp(1.65rem,4.3svh,1.95rem)}
  .section-heading{margin-bottom:20px}
  .section-heading .eyebrow{margin-bottom:10px}
  .section-heading>p{max-width:440px;line-height:1.5}
  .solution-card{padding:20px}
  .solution-card h3{font-size:1.15rem}
  .solution-card h3 br{display:none}
  .card-top{margin-bottom:14px}
  .solution-card p{margin-bottom:12px;line-height:1.5}
  .category-card{padding:12px 20px;grid-template-columns:48px 1fr 20px;gap:16px}
  .category-list{gap:10px}
  .category-bottom{margin-top:10px}
  .category-bottom .text-link{min-height:36px}
  .category-card .clay-icon{width:44px;height:44px;border-radius:15px}
  .category-card h3{font-size:1.075rem;margin-block:3px}
  .category-card p{line-height:1.45}
  .coffee-feature-copy h3{font-size:1.8rem}
  .massimo-copy h2{font-size:clamp(1.7rem,4.4svh,2rem);line-height:1.15;margin-bottom:14px}
  .massimo-copy h2 br{display:none}
  .massimo-copy h2 span{display:block}
  .massimo-wordmark{margin-block:10px;font-size:1.3rem}
  .massimo-copy>p:not(.eyebrow){margin-bottom:10px;line-height:1.5}
  .massimo-copy .button{margin-top:8px;min-height:48px;padding-block:11px}
  .contact-copy .eyebrow{margin-bottom:12px}
  .contact-address{margin-top:8px;padding-block:10px}
  .contact-card{padding:20px}
  .contact-card>.clay-icon{width:40px;height:40px;margin-bottom:10px;border-radius:14px}
  .contact-card>.clay-icon svg{width:24px;height:24px}
  .contact-card h3{font-size:1.25rem;margin-bottom:10px}
  .contact-card ul{margin-block:12px}
  .contact-card li{padding-block:8px}
  .contact-card .button{min-height:48px;padding-block:11px}
}
@media(min-width:721px) and (max-width:999px){
  .hero h1{font-size:clamp(2rem,min(5.5vw,6.5svh),3.5rem)}
  .hero-actions{gap:10px}
  .hero-art .origin-label{max-width:100%}
  .hero-art .micro-label{font-size:.75rem;letter-spacing:0}
  .massimo-photo{min-height:0;max-height:calc(var(--section-room) - 2 * var(--section-pad))}
}
@media(max-width:720px){
  .hero{gap:12px;padding-block:20px;min-height:var(--hero-room)}
  .hero h1{font-size:clamp(1.8rem,min(8.5vw,4.5svh),3.2rem);line-height:1.12;letter-spacing:-.04em;margin-block:14px}
  .hero-description{max-width:100%;font-size:1rem;line-height:1.5}
  .hero-actions{gap:6px 20px;margin-top:16px}
  .hero-actions .button{min-height:46px;padding:12px 16px;gap:14px}
  .hero-actions .text-link{min-height:36px}
  .hero-proof{margin-top:14px}
  .hero-art{height:clamp(115px,21svh,205px);max-height:none;width:100%;max-width:none;margin:0;min-height:0}
  .art-stage{height:100%;width:auto;max-width:100%;margin:0;border-radius:50%;aspect-ratio:1}
  .origin-label,.route-label,.art-caption{display:none}
  .massimo-photo{min-height:0;height:clamp(220px,42svh,380px)}
  .coffee-feature{min-height:0;height:clamp(260px,48svh,385px)}
}
@media(max-width:720px) and (max-height:740px){
  .hero{padding-block:14px;gap:8px}
  .hero h1{margin-block:10px;font-size:clamp(1.65rem,min(8vw,4.3svh),2rem)}
  .hero-actions{margin-top:12px}
  .hero-proof{margin-top:10px}
  .hero-art{height:clamp(80px,14svh,110px)}
}
@media(min-width:1000px) and (max-width:1100px) and (max-height:720px){
  .category-card{padding-block:8px}
  .category-list{gap:8px}
  .category-bottom{margin-top:8px}
}
@media print{.hero,.hero-art,.section,.massimo-layout{min-height:0;height:auto;max-height:none}}
