/* ==========================================================================
   Agência Print — Folha de estilos principal
   Mobile-first. Pontos de quebra: 600px (tablet), 960px (desktop), 1280px (wide)
   ========================================================================== */

:root {
	--agprint-primary: #1a3c6e;
	--agprint-primary-dark: #102847;
	--agprint-accent: #e2231a;
	--agprint-text: #222831;
	--agprint-text-light: #6b7280;
	--agprint-bg: #ffffff;
	--agprint-bg-alt: #f5f6f8;
	--agprint-border: #e3e6ea;
	--agprint-radius: 8px;
	--agprint-container: 1280px;
	--agprint-header-h: 64px;
}

* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body {
	margin: 0;
	font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
	color: var(--agprint-text);
	background: var(--agprint-bg);
	line-height: 1.55;
}
img { max-width: 100%; height: auto; display: block; }
a { color: inherit; text-decoration: none; }
ul { margin: 0; padding: 0; list-style: none; }
h1, h2, h3, h4 { margin: 0 0 .5em; line-height: 1.2; font-weight: 700; }
button { font-family: inherit; cursor: pointer; }
input, select, textarea { font-family: inherit; font-size: 16px; } /* 16px evita zoom automático no iOS */

.agprint-container { max-width: var(--agprint-container); margin: 0 auto; padding: 0 16px; }
.agprint-container--narrow { max-width: 860px; }

.agprint-btn {
	display: inline-flex; align-items: center; justify-content: center;
	background: var(--agprint-accent); color: #fff; border: none;
	padding: 12px 22px; border-radius: var(--agprint-radius);
	font-weight: 700; font-size: 15px; transition: background .15s ease;
}
.agprint-btn:hover { background: #b81a13; }
.agprint-btn--large { padding: 15px 28px; font-size: 16px; }
.agprint-btn--small { padding: 8px 14px; font-size: 13px; }
.agprint-btn--full { width: 100%; }
.agprint-btn[disabled] { opacity: .6; pointer-events: none; }

/* ==========================================================================
   Topbar de aviso
   ========================================================================== */
.agprint-topbar { background: var(--agprint-primary-dark); color: #fff; text-align: center; font-size: 13px; }
.agprint-topbar p { margin: 0; padding: 8px 16px; }

/* ==========================================================================
   Cabeçalho
   ========================================================================== */
.agprint-header { background: #fff; border-bottom: 1px solid var(--agprint-border); position: sticky; top: 0; z-index: 100; }
.agprint-header__main {
	display: flex; align-items: center; gap: 14px;
	height: var(--agprint-header-h);
}
.agprint-header__logo { flex: 0 0 auto; margin-right: auto; }
.agprint-header__logo img { max-height: 42px; width: auto; }
.agprint-header__logo-text { font-size: 22px; font-weight: 800; color: var(--agprint-primary); }

.agprint-hamburger {
	display: flex; flex-direction: column; justify-content: center; gap: 5px;
	width: 40px; height: 40px; background: none; border: none; padding: 0;
}
.agprint-hamburger span { display: block; height: 2px; width: 22px; background: var(--agprint-text); transition: transform .2s, opacity .2s; }
.agprint-hamburger[aria-expanded="true"] span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
.agprint-hamburger[aria-expanded="true"] span:nth-child(2) { opacity: 0; }
.agprint-hamburger[aria-expanded="true"] span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }

.agprint-header__search { display: none; }
.agprint-header__search input {
	border: 1px solid var(--agprint-border); border-radius: 999px; padding: 9px 16px;
	width: 260px; background: var(--agprint-bg-alt);
}
.agprint-header__search button { background: none; border: none; margin-left: -34px; padding: 6px; color: var(--agprint-text-light); }

.agprint-header__actions { display: flex; align-items: center; gap: 14px; }
.agprint-header__action { display: flex; align-items: center; gap: 6px; font-size: 13px; font-weight: 600; position: relative; }
.agprint-header__action--account span { display: none; }
.agprint-cart-count {
	position: absolute; top: -6px; right: -10px; background: var(--agprint-accent); color: #fff;
	font-size: 10px; min-width: 16px; height: 16px; border-radius: 50%;
	display: flex; align-items: center; justify-content: center; padding: 0 3px;
}

/* Navegação desktop escondida no mobile */
.agprint-header__nav { display: none; }

/* ==========================================================================
   Mega menu (desktop)
   ========================================================================== */
.agprint-mega-menu__top { display: flex; }
.agprint-mega-menu__item { position: relative; }
.agprint-mega-menu__toplink, .agprint-mega-menu__item--all > a {
	display: flex; align-items: center; gap: 5px; padding: 14px 16px; font-weight: 600; font-size: 14.5px;
	border-bottom: 3px solid transparent; white-space: nowrap;
}
.agprint-mega-menu__item--all > a { color: var(--agprint-primary); }
.agprint-caret { width: 7px; height: 7px; border-right: 2px solid currentColor; border-bottom: 2px solid currentColor; transform: rotate(45deg); margin-top: -3px; }

.agprint-mega-menu__item:hover > .agprint-mega-menu__toplink,
.agprint-mega-menu__item:focus-within > .agprint-mega-menu__toplink {
	color: var(--agprint-primary); border-bottom-color: var(--agprint-accent);
}

.agprint-mega-panel {
	display: none; position: absolute; left: 0; top: 100%; width: 100vw; max-width: var(--agprint-container);
	background: #fff; border: 1px solid var(--agprint-border); border-top: 3px solid var(--agprint-accent);
	box-shadow: 0 18px 40px rgba(0,0,0,.12); z-index: 50;
}
.agprint-mega-menu__item.has-panel:hover .agprint-mega-panel,
.agprint-mega-menu__item.has-panel:focus-within .agprint-mega-panel { display: block; }
.agprint-mega-panel__inner { display: flex; gap: 32px; padding: 28px 32px; }
.agprint-mega-panel__columns { display: grid; grid-template-columns: repeat(4, minmax(160px,1fr)); gap: 24px; flex: 1; max-height: 60vh; overflow-y: auto; }
.agprint-mega-panel__col { min-width: 0; }
.agprint-mega-panel__colheading { display: block; font-weight: 700; color: var(--agprint-primary); margin-bottom: 8px; font-size: 14px; }
.agprint-mega-panel__col ul { display: flex; flex-direction: column; gap: 6px; }
.agprint-mega-panel__col ul a { font-size: 13.5px; color: var(--agprint-text-light); }
.agprint-mega-panel__col ul a:hover { color: var(--agprint-accent); }

.agprint-mega-panel__feature { flex: 0 0 200px; text-align: center; }
.agprint-mega-panel__feature img { border-radius: var(--agprint-radius); margin-bottom: 10px; }
.agprint-mega-panel__feature-placeholder {
	width: 100%; aspect-ratio: 1/1; background: var(--agprint-bg-alt); border-radius: var(--agprint-radius);
	display: flex; align-items: center; justify-content: center; font-size: 12px; color: var(--agprint-text-light); padding: 10px; text-align: center;
}
.agprint-mega-panel__feature-title { font-weight: 700; margin-bottom: 10px; }

/* ==========================================================================
   Menu mobile (accordion em painel lateral)
   ========================================================================== */
.agprint-mobile-panel {
	position: fixed; top: 0; left: 0; height: 100%; width: min(88vw, 360px);
	background: #fff; z-index: 200; transform: translateX(-100%);
	transition: transform .25s ease; overflow-y: auto; padding: 16px;
}
.agprint-mobile-panel.is-open { transform: translateX(0); }
.agprint-mobile-overlay {
	position: fixed; inset: 0; background: rgba(0,0,0,.45); z-index: 190;
	opacity: 0; pointer-events: none; transition: opacity .2s ease;
}
.agprint-mobile-overlay.is-open { opacity: 1; pointer-events: auto; }
body.agprint-menu-open { overflow: hidden; }

.agprint-mobile-panel__search input { width: 100%; padding: 10px 14px; border: 1px solid var(--agprint-border); border-radius: 999px; margin-bottom: 14px; }

.agprint-mobile-menu__level0 > li { border-bottom: 1px solid var(--agprint-border); }
.agprint-mobile-menu__row { display: flex; align-items: center; justify-content: space-between; }
.agprint-mobile-menu__row a { display: block; padding: 13px 4px; font-weight: 600; flex: 1; }
.agprint-mobile-toggle { background: none; border: none; width: 36px; height: 36px; position: relative; flex-shrink: 0; }
.agprint-mobile-toggle span { position: absolute; inset: 0; margin: auto; width: 10px; height: 10px; border-right: 2px solid var(--agprint-text); border-bottom: 2px solid var(--agprint-text); transform: rotate(45deg); transition: transform .2s; }
.agprint-mobile-toggle[aria-expanded="true"] span { transform: rotate(225deg); }

.agprint-mobile-menu__level1, .agprint-mobile-menu__level2 { display: none; padding-left: 14px; }
.agprint-mobile-menu__level1.is-open, .agprint-mobile-menu__level2.is-open { display: block; }
.agprint-mobile-menu__level1 a, .agprint-mobile-menu__level2 a { font-weight: 400; padding: 10px 4px; }

/* ==========================================================================
   Hero / Banner aleatório (sem setas nem controlos)
   ========================================================================== */
.agprint-hero {
	background-color: var(--agprint-bg-alt); background-size: cover; background-position: center;
	min-height: 220px; display: flex; align-items: center; color: #fff; position: relative;
}
.agprint-hero::before { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, rgba(0,0,0,.55), rgba(0,0,0,.05)); }
.agprint-hero__inner { position: relative; z-index: 1; padding: 40px 16px; max-width: 520px; }
.agprint-hero__text { font-size: 1.4rem; font-weight: 700; margin-bottom: 16px; }
.agprint-hero--empty { color: var(--agprint-text-light); }
.agprint-hero--empty::before { display: none; }
.agprint-hero--empty .agprint-hero__inner { color: var(--agprint-text-light); }

/* ==========================================================================
   Secções gerais
   ========================================================================== */
.agprint-section { padding: 36px 0; }
.agprint-section--alt { background: var(--agprint-bg-alt); }
.agprint-section__header { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; flex-wrap: wrap; }
.agprint-section__title { font-size: 1.4rem; }
.agprint-section__viewall { font-weight: 700; color: var(--agprint-accent); font-size: 14px; white-space: nowrap; }

/* ==========================================================================
   Grelha de categorias (homepage)
   ========================================================================== */
.agprint-cat-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 14px; }
.agprint-cat-card { border-radius: var(--agprint-radius); overflow: hidden; background: var(--agprint-bg-alt); border: 1px solid var(--agprint-border); transition: box-shadow .15s ease; }
.agprint-cat-card:hover { box-shadow: 0 10px 24px rgba(0,0,0,.08); }
.agprint-cat-card__image { aspect-ratio: 1/1; overflow: hidden; }
.agprint-cat-card__image img { width: 100%; height: 100%; object-fit: cover; }
.agprint-cat-card__title { padding: 12px; font-weight: 700; text-align: center; font-size: 14px; }

/* ==========================================================================
   Cartão de produto + grelhas
   ========================================================================== */
.agprint-product-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 16px; }
.agprint-product-grid--archive { grid-template-columns: repeat(2, 1fr); }
.agprint-card { display: block; border: 1px solid var(--agprint-border); border-radius: var(--agprint-radius); overflow: hidden; background: #fff; transition: box-shadow .15s ease, transform .15s ease; }
.agprint-card:hover { box-shadow: 0 12px 26px rgba(0,0,0,.09); transform: translateY(-2px); }
.agprint-card__image { aspect-ratio: 1/1; background: var(--agprint-bg-alt); overflow: hidden; }
.agprint-card__image img { width: 100%; height: 100%; object-fit: cover; }
.agprint-card__placeholder { width: 100%; height: 100%; display: flex; align-items: center; justify-content: center; color: var(--agprint-text-light); font-size: 12px; text-align: center; padding: 10px; }
.agprint-card__body { padding: 12px 14px; }
.agprint-card__title { font-size: 14px; margin: 0 0 4px; }
.agprint-card__price { font-size: 13px; color: var(--agprint-text-light); margin: 0; }
.agprint-card__price strong { color: var(--agprint-accent); }

/* ==========================================================================
   Breadcrumbs
   ========================================================================== */
.agprint-breadcrumbs { margin: 16px 0; font-size: 12.5px; color: var(--agprint-text-light); }
.agprint-breadcrumbs ol { display: flex; flex-wrap: wrap; gap: 4px; }
.agprint-breadcrumbs li:not(:last-child)::after { content: "/"; margin-left: 6px; color: var(--agprint-border); }
.agprint-breadcrumbs a:hover { color: var(--agprint-accent); }

/* ==========================================================================
   Página de categoria
   ========================================================================== */
.agprint-category-hero { display: flex; align-items: center; gap: 20px; margin-bottom: 20px; flex-wrap: wrap; }
.agprint-category-hero__image { width: 110px; height: 110px; border-radius: var(--agprint-radius); overflow: hidden; flex-shrink: 0; }
.agprint-category-hero__image img { width: 100%; height: 100%; object-fit: cover; }
.agprint-category-hero__title { font-size: 1.6rem; margin-bottom: 6px; }
.agprint-category-hero__desc { color: var(--agprint-text-light); font-size: 14px; }

.agprint-subcat-filters { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 24px; }
.agprint-subcat-filters__chip {
	border: 1px solid var(--agprint-border); border-radius: 999px; padding: 7px 14px; font-size: 13px; font-weight: 600;
	background: var(--agprint-bg-alt);
}
.agprint-subcat-filters__chip:hover { border-color: var(--agprint-accent); color: var(--agprint-accent); }

.agprint-empty-state { padding: 40px 0; text-align: center; color: var(--agprint-text-light); }
.agprint-pagination { display: flex; justify-content: center; gap: 8px; margin: 30px 0; }
.agprint-pagination .page-numbers { padding: 8px 13px; border: 1px solid var(--agprint-border); border-radius: 6px; font-size: 14px; }
.agprint-pagination .page-numbers.current { background: var(--agprint-primary); color: #fff; border-color: var(--agprint-primary); }

/* ==========================================================================
   Página de produto
   ========================================================================== */
.agprint-product { display: grid; grid-template-columns: 1fr; gap: 26px; padding: 10px 0 30px; }
.agprint-product__main-image { aspect-ratio: 1/1; background: var(--agprint-bg-alt); border-radius: var(--agprint-radius); overflow: hidden; }
.agprint-product__main-image img { width: 100%; height: 100%; object-fit: cover; }
.agprint-product__thumbs { display: flex; gap: 8px; margin-top: 10px; overflow-x: auto; padding-bottom: 4px; }
.agprint-product__thumb { flex: 0 0 auto; border: 2px solid transparent; border-radius: 6px; overflow: hidden; padding: 0; background: none; width: 64px; height: 64px; }
.agprint-product__thumb img { width: 100%; height: 100%; object-fit: cover; }
.agprint-product__thumb.is-active { border-color: var(--agprint-accent); }

.agprint-product__cat { font-size: 12px; font-weight: 700; color: var(--agprint-accent); text-transform: uppercase; letter-spacing: .04em; }
.agprint-product__title { font-size: 1.6rem; margin: 6px 0 10px; }
.agprint-product__excerpt { color: var(--agprint-text-light); margin-bottom: 14px; font-size: 14.5px; }

.agprint-product__price { margin-bottom: 16px; }
.agprint-product__price-label { font-size: 12.5px; color: var(--agprint-text-light); display: block; }
.agprint-product__price-value { font-size: 1.7rem; font-weight: 800; color: var(--agprint-accent); }

.agprint-product__form { display: flex; flex-direction: column; gap: 14px; }
.agprint-field label { display: block; font-weight: 700; font-size: 13.5px; margin-bottom: 6px; }
.agprint-field select, .agprint-field input, .agprint-field textarea {
	width: 100%; padding: 11px 12px; border: 1px solid var(--agprint-border); border-radius: 6px; background: #fff;
}
.agprint-field--contact { display: flex; flex-direction: column; gap: 10px; padding-top: 6px; border-top: 1px solid var(--agprint-border); }
.agprint-honeypot { position: absolute !important; left: -9999px !important; width: 1px; height: 1px; opacity: 0; }
.agprint-form-feedback { font-size: 13.5px; min-height: 18px; }
.agprint-form-feedback.is-success { color: #1a7f37; }
.agprint-form-feedback.is-error { color: var(--agprint-accent); }

.agprint-product__trust { display: flex; flex-wrap: wrap; gap: 10px 18px; margin-top: 18px; font-size: 12.5px; color: var(--agprint-text-light); }
.agprint-product__trust li::before { content: "✓ "; color: #23272b; font-weight: 700; }

.agprint-product__tabs { margin-top: 10px; border-top: 1px solid var(--agprint-border); padding-top: 20px; }
.agprint-product__tab-nav { display: flex; gap: 6px; margin-bottom: 16px; flex-wrap: wrap; }
.agprint-product__tab-nav button { background: var(--agprint-bg-alt); border: 1px solid var(--agprint-border); padding: 9px 16px; border-radius: 6px; font-weight: 700; font-size: 13.5px; }
.agprint-product__tab-nav button.is-active { background: var(--agprint-primary); color: #fff; border-color: var(--agprint-primary); }
.agprint-product__tab-panel { display: none; }
.agprint-product__tab-panel.is-active { display: block; }
.agprint-price-table { width: 100%; border-collapse: collapse; font-size: 14px; }
.agprint-price-table th, .agprint-price-table td { border: 1px solid var(--agprint-border); padding: 9px 12px; text-align: left; }
.agprint-price-table th { background: var(--agprint-bg-alt); }

/* ==========================================================================
   Páginas simples / blog
   ========================================================================== */
.agprint-page-title { font-size: 1.7rem; margin: 24px 0 16px; }
.agprint-page-thumb { border-radius: var(--agprint-radius); overflow: hidden; margin-bottom: 20px; }
.agprint-page-content { font-size: 15.5px; }
.agprint-page-content img { border-radius: var(--agprint-radius); }
.agprint-blog-grid { display: grid; grid-template-columns: repeat(2,1fr); gap: 20px; margin-top: 20px; }
.agprint-blog-card__image { border-radius: var(--agprint-radius); overflow: hidden; margin-bottom: 8px; }

/* ==========================================================================
   Rodapé
   ========================================================================== */
.agprint-footer { background: var(--agprint-primary-dark); color: #dbe3ee; margin-top: 40px; }
.agprint-footer__grid { display: grid; grid-template-columns: 1fr; gap: 28px; padding: 44px 16px 30px; }
.agprint-footer__col h3 { color: #fff; font-size: 14px; text-transform: uppercase; letter-spacing: .04em; margin-bottom: 14px; }
.agprint-footer__col ul { display: flex; flex-direction: column; gap: 9px; }
.agprint-footer__col a { font-size: 13.5px; color: #b9c4d6; }
.agprint-footer__col a:hover { color: #fff; }
.agprint-footer__logo-text { font-size: 20px; font-weight: 800; color: #fff; }
.agprint-footer__social { display: flex; gap: 12px; margin-top: 14px; flex-wrap: wrap; }
.agprint-footer__social a { font-size: 12.5px; border: 1px solid rgba(255,255,255,.25); padding: 6px 12px; border-radius: 999px; }
.agprint-footer__bottom { border-top: 1px solid rgba(255,255,255,.12); padding: 16px; text-align: center; font-size: 12.5px; color: #8ea0bb; }

/* ==========================================================================
   Tablet (>= 600px)
   ========================================================================== */
@media (min-width: 600px) {
	.agprint-cat-grid { grid-template-columns: repeat(3, 1fr); }
	.agprint-product-grid { grid-template-columns: repeat(3, 1fr); }
	.agprint-product-grid--archive { grid-template-columns: repeat(3, 1fr); }
	.agprint-footer__grid { grid-template-columns: repeat(2, 1fr); }
	.agprint-blog-grid { grid-template-columns: repeat(2,1fr); }
}

/* ==========================================================================
   Desktop (>= 960px) — mega menu completo aparece aqui
   ========================================================================== */
@media (min-width: 960px) {
	.agprint-hamburger { display: none; }
	.agprint-header__search { display: block; }
	.agprint-header__action--account span { display: inline; }
	.agprint-header__nav { display: block; border-top: 1px solid var(--agprint-border); }

	.agprint-cat-grid { grid-template-columns: repeat(4, 1fr); }
	.agprint-product-grid { grid-template-columns: repeat(4, 1fr); }
	.agprint-product-grid--archive { grid-template-columns: repeat(4, 1fr); }

	.agprint-product { grid-template-columns: 1fr 1fr; align-items: start; }
	.agprint-product__gallery { position: sticky; top: calc(var(--agprint-header-h) + 20px); }

	.agprint-footer__grid { grid-template-columns: 1.4fr 1fr 1fr 1fr; }
}

/* ==========================================================================
   Wide (>= 1280px)
   ========================================================================== */
@media (min-width: 1280px) {
	.agprint-cat-grid { grid-template-columns: repeat(6, 1fr); }
	.agprint-product-grid { grid-template-columns: repeat(5, 1fr); }
}

/* Acessibilidade: foco visível */
a:focus-visible, button:focus-visible, input:focus-visible, select:focus-visible {
	outline: 2px solid var(--agprint-accent); outline-offset: 2px;
}
