/* Responsive safeguards that do not alter the approved desktop design. */
html{-webkit-text-size-adjust:100%;text-size-adjust:100%;overflow-x:clip}
body{min-width:320px;overflow-x:clip}
.eci-wrap,.eci-wrap>main,.eci-wrap>section,.eci-wrap>div,.eci-wrap>footer{min-width:0;max-width:100%}
section{min-width:0}
img,svg,video,iframe{max-width:100%;height:auto}
.eci-mobile-menu{display:none}

/* Mobile and narrow-tablet navigation. */
@media(max-width:860px){
  .eci-nav .container{position:relative;min-height:66px;flex-wrap:nowrap!important;gap:10px!important}
  .eci-logo{min-width:0;max-width:calc(100% - 58px)}
  .eci-logo img{display:block;width:auto!important;height:auto!important;max-height:48px;max-width:min(218px,64vw)!important}
  .eci-links,.eci-nav .eci-ytbtn,.eci-burger{display:none!important}
  .eci-mobile-menu{display:block;margin-left:auto;position:static;flex:none}
  .eci-mobile-menu>summary{display:grid;width:46px;height:46px;place-items:center;border:1px solid rgba(30,74,63,.17);border-radius:12px;background:rgba(255,253,250,.9);cursor:pointer;touch-action:manipulation;list-style:none}
  .eci-mobile-menu>summary::-webkit-details-marker{display:none}
  .eci-mobile-menu>summary span,.eci-mobile-menu>summary span:before,.eci-mobile-menu>summary span:after{display:block;width:20px;height:2px;border-radius:2px;background:var(--color-teal-dark);content:"";transition:transform .2s ease,opacity .2s ease}
  .eci-mobile-menu>summary span{position:relative}
  .eci-mobile-menu>summary span:before{position:absolute;top:-6px;left:0}
  .eci-mobile-menu>summary span:after{position:absolute;top:6px;left:0}
  .eci-mobile-menu[open]>summary span{background:transparent}
  .eci-mobile-menu[open]>summary span:before{top:0;transform:rotate(45deg)}
  .eci-mobile-menu[open]>summary span:after{top:0;transform:rotate(-45deg)}
  .eci-mobile-menu>.eci-mob{position:absolute;top:100%;left:0;right:0;z-index:1001;display:block!important;padding:10px 20px calc(18px + env(safe-area-inset-bottom));border-top:1px solid rgba(30,74,63,.09);background:rgba(251,248,243,.99);box-shadow:0 18px 30px rgba(30,74,63,.13)}
  .eci-mobile-menu:not([open])>.eci-mob{display:none!important}
  .eci-mobile-menu .eci-mob a:not(.btn){min-height:50px;border-bottom:1px solid rgba(30,74,63,.07)}
  .eci-mobile-menu .eci-mob .btn{width:100%;min-height:50px;margin-top:12px}
}

/* Phones. Existing page CSS controls the approved card order and layout. */
@media(max-width:720px){
  .container,.container-narrow{width:100%;max-width:100%;padding-left:18px!important;padding-right:18px!important}
  h1,h2,h3,p,li,summary,label,a,button{overflow-wrap:break-word}
  .btn{max-width:100%;min-height:48px;padding:12px 20px;white-space:normal;text-align:center;touch-action:manipulation}
  input,textarea,select{width:100%;max-width:100%;font-size:16px!important}
  input[type=checkbox],input[type=radio]{width:20px!important;min-width:20px}
  .eci-hero [style*="display:flex"][style*="flex-wrap:wrap"]>.btn{flex:1 1 100%;width:100%}
  .eci-hero-photo img{height:clamp(260px,82vw,330px)!important;object-position:50% 28%!important}
  .eci-context-card,.eci-context-card:nth-child(2){min-height:0;transform:none!important}
  .eci-lab-step:after{display:none}
  .eci-origin-card{position:relative;top:auto}
  .eci-audience-photo{display:block!important;width:100%!important;max-width:100%!important;min-height:0!important;height:auto!important;aspect-ratio:4/3!important}
  .eci-audience-photo>img{display:block!important;position:absolute!important;inset:0!important;width:100%!important;height:100%!important;object-fit:cover!important;object-position:72% 45%!important}
  .eci-learning-card{padding:24px 18px}
  .eci-guide-intro{align-items:stretch}
  .eci-guide-subscribe{align-self:flex-start}
  #guide [style*="grid-template-columns"]{grid-template-columns:minmax(0,1fr)!important}
  #guide form{padding:20px 16px!important}
  .eci-latte-card{gap:20px!important;padding:28px 20px!important}
  .eci-latte-button{width:100%;white-space:normal}
  section[style*="background:var(--color-teal-dark)"] .btn{width:100%;justify-content:center}
  #eciResume{max-width:calc(100vw - 32px);bottom:max(14px,env(safe-area-inset-bottom));white-space:normal;text-align:center}
  footer{padding-top:36px!important}
  footer [style*="text-align:right"]{text-align:left!important}
  footer img[alt^="QR code"]{width:64px!important;height:64px!important}
  .eci-about-beat,.eci-about-quote,.eci-about-close,.eci-contact-beat{padding-left:17px!important;padding-right:17px!important}
  .eci-credentials-accordion summary{padding:17px 15px!important;gap:10px!important}
  .eci-credentials-accordion details>div{padding:17px 15px 19px!important}
  .eci-voice-stage{min-width:0;padding:0!important}
  .eci-voice-panel{min-width:0}
}

@media(max-width:520px){
  .eci-channel-story-answer p+p{margin-top:14px!important}
  .eci-channel-story-answer .eci-channel-story-conclusion{margin-top:18px!important;padding-top:16px}
}

@media(max-width:374px){
  .container,.container-narrow{padding-left:14px!important;padding-right:14px!important}
  body{font-size:15.5px}
  .eci-logo img{max-width:min(194px,61vw)!important}
  .eci-mobile-menu>summary{width:44px;height:44px}
  .eci-hero h1,.eci-testimonial-hero h1{font-size:1.9rem!important}
  .eci-who-card,.eci-update-card,.eci-home-voice{padding-left:16px!important;padding-right:16px!important}
}

@media(prefers-reduced-motion:reduce){
  .eci-mobile-menu>summary span,.eci-mobile-menu>summary span:before,.eci-mobile-menu>summary span:after{transition:none}
}
