/* Apresentação e acessibilidade Náutico Eyewear */
:where(button,a,input,select,textarea):focus-visible{outline:3px solid #bd8e35;outline-offset:3px}
.hero-copy[hidden]{display:none!important}
.hero-arrow{position:absolute;top:48%;z-index:3;transform:translateY(-50%);border:1px solid #ffffffaa;background:#06193670;color:#fff;border-radius:50%;width:42px;height:42px;display:grid;place-items:center;font-size:31px;line-height:1}
.hero-arrow:hover{background:#061936e0}
.hero-arrow-prev{left:max(12px,calc((100vw - 1440px)/2))}
.hero-arrow-next{right:max(12px,calc((100vw - 1440px)/2))}
.hero-image picture{height:100%;display:block}
.hero-image img{max-height:none;height:100%;min-height:440px;object-position:center 32%}
.hero-controls{z-index:3}
.catalog-filters{display:grid;grid-template-columns:1.3fr 1fr auto auto;align-items:end;gap:11px;background:#f7f9fc;border:1px solid #e2e8f0;border-radius:14px;padding:18px;margin-bottom:24px}
.catalog-filters label{font-size:13px;font-weight:700;display:flex;flex-direction:column;gap:7px}
.catalog-filters input,.catalog-filters select{width:100%;border:1px solid #bbc6d6;border-radius:8px;padding:11px;background:#fff;min-height:44px;color:#0b1b36}
.catalog-filters button{background:#061936;color:#fff;border:0;border-radius:8px;padding:11px 18px;min-height:44px}
.catalog-filters>a{font-size:13px;text-decoration:underline;align-self:center;margin-top:15px}
.detail-primary{max-height:500px;object-fit:contain!important;background:#f8fafc}
.detail-gallery{display:grid;grid-template-columns:repeat(auto-fit,minmax(86px,1fr));gap:10px;margin-top:10px}
.detail-gallery img{width:100%;height:96px;object-fit:contain;background:#f8fafc;border:1px solid #e2e8f0;border-radius:9px}
.category:focus-visible,.product-card:focus-within{outline:3px solid #bd8e35;outline-offset:3px}
@media(max-width:950px){.catalog-filters{grid-template-columns:1fr 1fr}.hero-arrow{width:36px;height:36px}}
@media(max-width:720px){.hero-arrow{display:none}.hero-image img{min-height:340px;max-height:480px;object-position:center 23%}.catalog-filters{grid-template-columns:1fr 1fr}.catalog-filters>a{margin-top:0}.catalog-filters button{align-self:stretch}}
@media(max-width:480px){.catalog-filters{grid-template-columns:1fr}.hero-copy h1{font-size:38px;line-height:1.08}.benefit-row{grid-template-columns:1fr 1fr}.brand-type{min-width:0}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{scroll-behavior:auto!important;transition-duration:.01ms!important;animation-duration:.01ms!important}}

/* Ajustes de proporção conferidos em navegador */
@media(min-width:721px){
 .hero-card{height:450px;min-height:450px}
 .hero-copy{padding:38px 0 38px 18px}
 .hero-image{height:100%;min-height:0}
 .hero-image picture{height:100%;display:block}
 .hero-image img{height:100%;min-height:0!important;max-height:100%!important;object-fit:cover;object-position:50% 63%}
 .about-photo img{object-position:center 61%;max-height:325px}
}
.category img{object-position:center 70%}
@media(max-width:720px){
 .hero-card{height:auto;min-height:0}
 .hero-image{height:320px;min-height:320px}
 .hero-image picture{height:100%;display:block}
 .hero-image img{height:100%;min-height:0!important;max-height:100%!important;object-fit:cover;object-position:50% 62%}
 .about-photo img{object-position:center 62%}
}

/* Contenção real de largura e leitura em telas estreitas */
html,body{max-width:100%}
.wrap{width:100%;min-width:0}
@media(max-width:720px){
 .header-main{width:100%;min-width:0;gap:8px}
 .header-main>a{min-width:0;max-width:calc(100% - 74px)}
 .menu-toggle{display:block;flex:0 0 auto;white-space:nowrap}
 .nav{max-width:100%;z-index:20}
 .hero-card{width:100%;min-width:0;grid-template-columns:minmax(0,1fr)}
 .hero-copy,.hero-image{min-width:0;max-width:100%}
 .hero-copy{padding:38px 0 30px}
 .hero-copy h1{font-size:clamp(30px,9vw,39px);overflow-wrap:break-word;max-width:100%}
 .hero-copy p{font-size:15px;max-width:100%}
 .benefit-row{grid-template-columns:repeat(2,minmax(0,1fr));gap:4px 10px}
 .benefit{min-width:0;gap:8px}
 .benefit>div{min-width:0}
 .benefit strong,.benefit small{overflow-wrap:anywhere;font-size:11px}
 .benefit-symbol{font-size:22px;flex:0 0 22px}
 .categories,.product-grid{grid-template-columns:repeat(2,minmax(0,1fr));min-width:0}
 .category,.product-card{min-width:0;width:100%}
 .category-name{font-size:13px}
 .about-banner{grid-template-columns:minmax(0,1fr)}
 .about-banner>*{min-width:0;max-width:100%}
 .about-copy{padding:28px 18px}
 .about-copy h2{font-size:28px;overflow-wrap:break-word}
 .footer-cols{grid-template-columns:repeat(2,minmax(0,1fr))}
 .footer-cols>div{min-width:0}
 .section-heading h2{font-size:clamp(24px,7vw,29px);overflow-wrap:break-word}
 .heading-line{gap:8px}
 .heading-line:before,.heading-line:after{width:22px;flex-shrink:0}
}
@media(max-width:400px){
 .brand-anchor{width:28px;height:40px}
 .brand-name{font-size:21px}
 .brand-sub{font-size:7px}
 .brand{gap:5px}
 .hero-copy h1{font-size:32px}
 .benefit-row{gap:10px}
}

/* Navegação dos destaques */
.hero-dot{width:12px;height:12px;transition:background-color .2s ease,transform .2s ease;touch-action:manipulation}
.hero-dot:hover,.hero-dot[aria-current="true"]{transform:scale(1.15)}
.hero-copy:not([hidden]){animation:nautico-hero-enter .36s ease-out both}
@keyframes nautico-hero-enter{from{opacity:.15;transform:translateY(5px)}to{opacity:1;transform:translateY(0)}}
@media(prefers-reduced-motion:reduce){.hero-copy:not([hidden]){animation:none}}

/* Acesso por teclado e controles de destaque */
.skip-link{position:fixed;left:16px;top:-100px;z-index:999;background:#fff;color:#061936;border:2px solid #e6c477;padding:12px 18px;font-weight:700;border-radius:8px}
.skip-link:focus{top:12px}
.hero-controls{align-items:center}
.hero-pause{width:32px;height:32px;border:1px solid rgba(255,255,255,.8);background:rgba(6,25,54,.72);color:#fff;border-radius:50%;font-size:14px;padding:0;display:grid;place-items:center}
.hero-pause:hover{background:#061936}
.gallery-thumb{padding:3px;border:1px solid #cbd5e1;background:#fff;border-radius:9px;cursor:pointer;min-width:90px;min-height:90px}
.gallery-thumb[aria-pressed="true"],.gallery-thumb:hover{border-color:#b28b37;box-shadow:0 0 0 2px rgba(178,139,55,.24)}
.gallery-thumb img{width:100%;height:90px;object-fit:contain}
:where(a,button,input,select,textarea,summary):focus-visible{outline:3px solid #b4862f;outline-offset:3px}
.hero-image img{will-change:auto}
.hero .wrap{position:relative}
section[aria-label="Destaques da Náutico Eyewear"] .hero-arrow{z-index:3}
@media(max-width:720px){.hero-pause{width:28px;height:28px}.hero-controls{gap:9px}}

@media(min-width:1150px){.hero-arrow-prev{left:-65px}.hero-arrow-next{right:-65px}}

.related-collection{margin:40px auto 0;max-width:1214px;padding:18px 28px 30px;border-top:1px solid #e2e8f0}
.related-collection h2{text-align:center;margin:16px 0 24px;font-size:29px;color:#061936}
@media(max-width:720px){.related-collection{padding:18px 5px 23px}.related-collection h2{font-size:24px}}


/* Atendimento flutuante; o WhatsApp somente aparece com número oficial validado. */
.nautico-floating-contact{
 position:fixed;
 right:clamp(14px,2.2vw,30px);
 bottom:calc(20px + env(safe-area-inset-bottom,0px));
 z-index:55;
 display:inline-flex;
 align-items:center;
 justify-content:center;
 gap:10px;
 min-height:54px;
 padding:11px 17px;
 border-radius:999px;
 background:#061936;
 color:#fff;
 border:1px solid rgba(255,255,255,.20);
 box-shadow:0 8px 24px rgba(3,16,37,.24);
 font:700 14px/1.1 Arial,sans-serif;
 text-decoration:none;
 transition:transform .15s ease, box-shadow .15s ease;
}
.nautico-floating-contact.is-whatsapp{background:#128C56;color:#fff;}
.nautico-floating-contact svg{flex:0 0 27px}
.nautico-floating-contact:hover{transform:translateY(-3px);box-shadow:0 12px 26px rgba(3,16,37,.28)}
.nautico-floating-contact:focus-visible{outline:3px solid #e6c477;outline-offset:4px}
@media(max-width:720px){
 .nautico-floating-contact{
  right:16px;
  bottom:calc(16px + env(safe-area-inset-bottom,0px));
  min-width:54px;
  width:54px;
  height:54px;
  padding:12px;
 }
 .nautico-floating-contact span{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
}
@media(prefers-reduced-motion:reduce){.nautico-floating-contact{transition:none}}


/* Identidade visual da Náutico Eyewear */
:root{
 --navy:#061936;
 --navy2:#09234a;
 --gold:#d5b46e;
 --ink:#12233b;
 --muted:#566678;
 --line:#e4eaf0;
 --body-font:system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Arial,sans-serif;
 --display-font:Georgia,"Times New Roman",serif;
 --radius-card:14px;
}
body{font-family:var(--body-font);font-size:15px;line-height:1.57;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
.site-header,.footer{background:#061936}
h1,h2,h3{font-family:var(--display-font);letter-spacing:-.025em;line-height:1.14;text-wrap:balance}
p{overflow-wrap:break-word}
.section-heading h2{letter-spacing:-.025em}
.nav{font-family:var(--body-font);font-weight:500;letter-spacing:.005em}
.brand-name{letter-spacing:.072em}
.brand-sub{letter-spacing:.37em}
.product-card,.category{border-radius:var(--radius-card)}
.product-card{transition:transform .18s ease,border-color .18s ease,box-shadow .18s ease}
.product-card:hover{transform:translateY(-3px);box-shadow:0 12px 25px rgba(6,25,54,.065)}
.hero-copy h1{max-width:12ch;line-height:1.06}
.section{scroll-margin-top:35px}
.footer{padding-top:50px}
.footer h3{font-family:var(--body-font);font-size:13px;letter-spacing:.035em;font-weight:650}
.footer p{max-width:30ch;line-height:1.68}
.footer-socials{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin:20px 0 2px}
.footer .footer-social-icon{display:inline-flex;width:42px;height:42px;min-width:42px;min-height:42px;align-items:center;justify-content:center;color:#fff;border:1px solid rgba(255,255,255,.32);border-radius:50%;background:rgba(255,255,255,.035);margin:0;text-decoration:none;transition:background-color .18s,border-color .18s,transform .18s}
.footer .footer-social-icon svg{width:20px;height:20px}
.footer a.footer-social-icon:hover{color:#fff;background:rgba(255,255,255,.12);border-color:rgba(255,255,255,.8);transform:translateY(-2px)}
.footer .footer-social-icon.is-unconfigured{opacity:.68;cursor:default}
.footer .footer-social-icon:focus-visible{outline:3px solid #e6c477;outline-offset:4px}
.footer-bottom{border-color:rgba(255,255,255,.26);margin-top:36px}
@media(max-width:720px){
 .footer{padding-top:36px}
 .footer-socials{gap:9px;margin-top:16px}
 .footer .footer-social-icon{width:40px;height:40px;min-width:40px;min-height:40px}
 .hero-copy h1{max-width:100%;font-size:clamp(30px,8.5vw,41px)}
}
@media(prefers-reduced-motion:reduce){
 .product-card,.footer .footer-social-icon{transition:none}
}

/* Hierarquia visual dos destaques e vitrine com apenas um modelo */
.hero-copy h1{color:#fff}
.hero-copy p{color:#ebf1f9;line-height:1.57}
.hero-copy .pill-gold{color:#071b36}
.product-grid.is-single{grid-template-columns:minmax(240px,300px);justify-content:center}
@media(max-width:520px){.product-grid.is-single{grid-template-columns:minmax(0,1fr);max-width:340px;margin-inline:auto}}

/* Rodapé em telas estreitas: marca e quatro redes em uma linha própria */
@media(max-width:620px){
 .footer-cols{grid-template-columns:repeat(2,minmax(0,1fr))}
 .footer-cols>div:first-child,.footer-cols>div:last-child{grid-column:1/-1}
 .footer-socials{flex-wrap:nowrap;gap:10px}
 .footer .footer-social-icon{flex:0 0 42px;width:42px;height:42px}
 .footer .brand{transform:scale(.75);transform-origin:left top}
}

/* Menu compacto antes que a navegação ultrapasse a largura dos tablets. */
@media(min-width:721px) and (max-width:1050px){
 .header-main{height:72px}
 .menu-toggle{display:block}
 .nav{display:none;position:absolute;top:72px;left:0;right:0;background:#061936;padding:16px 25px 24px;flex-direction:column;align-items:stretch;gap:0;border-top:1px solid #36506d}
 .nav.is-open{display:flex}
 .nav a{padding:12px}
}