/* Home editorial. No selectors below affect other public pages. */
.home-page { background: radial-gradient(ellipse at 50% 25%, #183043, #080f17 75%); padding: 18px clamp(12px, 3.3vw, 54px); color: var(--color-ivory); }
.home-shell { max-width: 1440px; margin: auto; border: 1px solid #29404e; border-radius: 17px; background: linear-gradient(145deg,#06121a,#08131b 70%,#0b1b28); box-shadow: 0 24px 70px #0007; overflow: clip; }
.home-page .navbar { min-height: 76px; padding: 0 4.5%; display: grid; grid-template-columns: 1fr auto 1fr; gap: 24px; background: #051018c9; border-color: #2b3e49; }
.home-page .navbar .logo { font: 600 clamp(22px,2.4vw,34px)/1 Georgia,serif; letter-spacing: .24em; white-space: nowrap; }
.home-page .nav-links { gap: clamp(18px,2.5vw,36px); }
.home-page .nav-links a { font-size: 13px; padding-block: 25px; }
.home-page .nav-links a[aria-current="page"] { color: var(--color-gold-hover); }
.header-tools { display: flex; justify-content: flex-end; gap: 14px; }
.header-tools a { display: grid; place-items: center; min-width: 44px; min-height: 44px; }
.header-tools a:first-child { color: var(--color-gold-hover); }
.header-tools svg { width: 21px; height: 21px; fill: none; stroke: currentColor; stroke-width: 1.4; }
.home-page .hero { position: relative; isolation: isolate; min-height: clamp(420px,30vw,620px); padding: 44px 5% 42px; display: flex; align-items: center; background: #09131b; overflow: hidden; }
.home-page .hero::before { content: ''; position: absolute; z-index: -2; inset: 0; background: url('../assets/img/fondo-homepage.png') center top / cover no-repeat; }
.home-page .hero::after { content: ''; position: absolute; z-index: -1; inset: 0; background: linear-gradient(90deg,#06101899 0%,#06101855 36%,transparent 62%,#06101822 82%,#06101899 100%),linear-gradient(0deg,#06101866,transparent 28%); }
.hero-content { width: 58%; position: relative; }
.hero-label,.eyebrow { color: var(--color-gold-hover); font-size: 10px; letter-spacing: .34em; margin-bottom: 14px; }
.home-page .hero h1 { font: 400 clamp(38px,4.75vw,72px)/.98 Georgia,'Times New Roman',serif; letter-spacing: -.045em; margin-bottom: 18px; }
.hero h1 span { display: block; }
.hero-content > p:not(.hero-label) { color: #d0d4d9; font-size: 14px; line-height: 1.6; max-width: 47ch; margin-bottom: 25px; }
.home-page .hero .button { background: linear-gradient(115deg,#f0d49e,#c2a06a); color: #0b1118; border: 1px solid #ecd19e; border-radius: 3px; padding: 12px 25px; font-size: 11px; text-transform: uppercase; letter-spacing: .09em; box-shadow: inset 0 1px 0 #fff5; }
.hero .button span { margin-left: 16px; font-size: 19px; vertical-align: middle; }
.home-page .hero .button:hover { background: #e2c38b; transform: none; }
.hero-signature { position: absolute; right: 2.5%; top: 32%; width: 105px; }
.hero-signature p { font: 10px/1.9 Georgia,serif; letter-spacing: .22em; }
.hero-signature p:last-child { font-size: 13px; }
.hero-signature > span,.gold-rule { display: block; width: 28px; height: 1px; background: var(--color-gold); margin: 28px 0; }
.home-benefits { padding: 16px 5%; background: linear-gradient(90deg,#0a1720,#101f2a); border-block: 1px solid #2b3e4980; }
.home-benefits ul { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); list-style: none; max-width: 1000px; }
.home-benefits li { display: flex; gap: 13px; padding: 0 24px; align-items: center; }
.home-benefits li:first-child { padding-left: 0; }
.home-benefits li+li { border-left: 1px solid #b8985f66; }
.home-benefits svg { flex: 0 0 25px; width: 25px; height: 25px; fill: none; stroke: var(--color-gold-hover); stroke-width: 1.25; }
.home-benefits h2 { font-size: 12px; font-weight: 500; }
.home-benefits p { font-size: 10px; color: var(--color-silver); line-height: 1.5; margin-top: 3px; }
.home-page .featured { padding: 24px 2% 18px; display: grid; grid-template-columns: minmax(0,2.25fr) minmax(240px,1fr); gap: 18px; }
.featured-catalog { min-width: 0; }
.home-page .section-header { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-bottom: 15px; }
.home-page .section-header h2 { font-size: 20px; font-weight: 500; }
.home-page .section-header > a { font-size: 12px; color: var(--color-gold-hover); white-space: nowrap; text-decoration: underline; text-underline-offset: 4px; }
.section-header > a span { margin-left: 8px; }
.featured-catalog > [role] { color: var(--color-silver); padding: 8px 0; font-size: 13px; }
.featured-catalog > [role]:empty { display: none; }
.home-page .product-grid { grid-template-columns: repeat(4,minmax(0,1fr)); gap: 11px; }
.home-page .product-card { padding: 7px; border: 1px solid #293c49; border-radius: 9px; background: linear-gradient(135deg,#17242e,#0c1821); transition: border-color var(--transition-quiet); }
.home-page .product-card:hover { border-color: #847459; }
.home-page .product-image { aspect-ratio: 4/5; border-radius: 5px; background: #081018; margin-bottom: 10px; }
.home-page .product-image img { background: #ffffff; }
.home-page .product-brand { font-size: 12px; color: var(--color-ivory); text-transform: none; letter-spacing: 0; font-weight: 600; }
.home-page .product-info h3 { font-size: 11px; color: var(--color-silver); line-height: 1.45; font-weight: 400; margin-bottom: 7px; }
.home-page .product-price { color: var(--color-ivory); font-size: 12px; font-weight: 600; }
.editorial-banner { min-height: 310px; border: 1px solid #34434c; border-radius: 9px; padding: 28px 20px 16px; display: flex; flex-direction: column; justify-content: space-between; background: linear-gradient(90deg,#061018dd,#06101844),url('../assets/img/catalogo/van-cleef-pulsera-dorado-verde-2.png') center 55% / cover; }
.editorial-kicker { font: 17px/1.5 Georgia,serif; letter-spacing: .2em; }
.editorial-banner .gold-rule { margin: 18px 0; }
.editorial-banner div > p:last-child { font: 10px/1.9 Georgia,serif; letter-spacing: .24em; }
.banner-caption { color: #e1c28c; font: 10px/1.5 Georgia,serif; letter-spacing: .16em; padding-top: 22px; }
.home-discovery { width: 100%; max-width: 1160px; margin: 18px auto 28px; padding: 0 2% 20px; display: grid; grid-template-columns: minmax(0,1fr); gap: 15px; }
.inspiration-panel { border: 1px solid #293e4c; border-radius: 9px; background: linear-gradient(135deg,#09171f,#071119); min-width: 0; padding: 25px; }
.inspiration-copy > p:not(.eyebrow) { font-size: 12px; color: var(--color-silver); line-height: 1.6; }
.inspiration-panel { display: grid; grid-template-columns: minmax(0,.85fr) minmax(0,1.15fr); gap: clamp(24px,3vw,44px); padding: clamp(24px,3vw,40px); }
.inspiration-copy { align-self: center; max-width: 38ch; }
.inspiration-copy .eyebrow { font-size: 8px; margin-bottom: 10px; }
.inspiration-copy h2 { font: 400 clamp(25px,2.35vw,36px)/1.02 Georgia,serif; letter-spacing: -.03em; margin-bottom: 12px; }
.outline-cta { display: inline-block; border: 1px solid var(--color-gold); border-radius: 2px; font-size: 9px; letter-spacing: .15em; color: var(--color-gold-hover); padding: 10px 16px; margin-top: 17px; }
.outline-cta span { margin-left: 12px; }
.editorial-tiles { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 12px; }
.editorial-tiles a { min-height: 180px; aspect-ratio: 4/3; border: 1px solid #30414a; border-radius: 4px; padding: 9px; display: flex; align-items: flex-end; background-size: cover; background-position: center 60%; }
.editorial-tiles a span { display: flex; justify-content: space-between; width: 100%; gap: 6px; font-size: 9px; letter-spacing: .025em; }
.editorial-tiles b { color: var(--color-gold-hover); }
.tile-hoodies { background-image: linear-gradient(0deg,#040b12,#040b1255),url('../assets/img/catalogo/essentials-hoodie-fleece-black.png'); }
.tile-accessories { background-image: linear-gradient(0deg,#040b12,#040b1255),url('../assets/img/catalogo/van-cleef-pulsera-dorado-negro.png'); }
.tile-pants { background-image: linear-gradient(0deg,#040b12,#040b1255),url('../assets/img/catalogo/essentials-pants-fleece-black.jpg'); }
.tile-shirts { background-image: linear-gradient(0deg,#040b12,#040b1255),url('../assets/img/catalogo/essentials-t-shirt-fleece-black.jpg'); }
.home-footer { display: flex; align-items: center; gap: 24px; padding: 8px 2.5% 20px; color: var(--color-silver); }
.home-footer-logo { font: 20px Georgia,serif; letter-spacing: .14em; color: var(--color-ivory); }
.home-footer > p { font-size: 10px; border-left: 1px solid var(--color-gold); padding-left: 24px; }
.home-footer nav { display: flex; gap: 16px; margin-left: auto; font-size: 11px; }
.home-footer small { font-size: 10px; }
.home-page :is(.outline-cta,.editorial-tiles a):hover { border-color: var(--color-gold); }
.home-page a:focus-visible { outline: 2px solid var(--color-gold-hover); outline-offset: 4px; }
@media (max-width:1100px) {
 .home-page .navbar { grid-template-columns: auto 1fr auto; padding-inline: 3%; gap: 16px; }
 .home-page .nav-links { justify-content: center; gap: 18px; }
 .header-tools { gap: 0; }
 .home-page .featured { grid-template-columns: minmax(0,3fr) minmax(190px,1fr); }
 .home-page .product-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
 .home-discovery { grid-template-columns: 1fr; }
 .editorial-tiles a { min-height: 160px; }
 .hero-signature { right: 2%; width: 80px; }
 .hero-signature p:last-child { font-size: 10px; }
 .home-footer { flex-wrap: wrap; gap: 15px; }
}
@media (max-width:650px) {
 .home-page { padding: 10px; }
 .home-shell { border-radius: 12px; }
 .home-page .navbar { min-height: 66px; grid-template-columns: 1fr auto auto; gap: 6px; padding-inline: 5%; }
 .home-page .navbar .logo { font-size: 22px; letter-spacing: .16em; }
 .home-page .nav-links { display: none; }
 .header-tools a { min-width: 36px; }
 .home-page .hero { min-height: 440px; padding: 35px 6%; align-items: flex-start; }
 .hero-content { width: 100%; }
 .home-page .hero h1 { font-size: clamp(32px,8.5vw,52px); }
 .hero-content > p:not(.hero-label) { max-width: 28ch; font-size: 12px; }
 .home-page .hero::before { inset: 0; background-position: 65% top; }
 .home-page .hero::after { background: linear-gradient(90deg,#061018d9,#06101866 70%,#06101833),linear-gradient(0deg,#061018bb,transparent 45%); }
 .hero-signature { top: auto; bottom: 25px; right: 6%; width: auto; display: flex; align-items: center; gap: 16px; }
 .hero-signature > span { width: 24px; margin: 0; }
 .hero-signature p { font-size: 8px; }
 .home-benefits { padding: 4px 6%; }
 .home-benefits ul { grid-template-columns: 1fr; }
 .home-benefits li,.home-benefits li:first-child { padding: 12px 0; }
 .home-benefits li+li { border-left: 0; border-top: 1px solid #30404c; }
 .home-page .featured { padding: 22px 4%; grid-template-columns: 1fr; gap: 18px; }
 .home-page .section-header h2 { font-size: 18px; }
 .editorial-banner { min-height: 240px; background-position: center 55%; }
 .home-discovery { padding: 0 4% 22px; }
 .inspiration-panel { padding: 20px 16px; }
 .inspiration-panel { grid-template-columns: 1fr; }
 .editorial-tiles a { min-height: 140px; aspect-ratio: 1/1; }
 .home-footer { padding: 0 5% 22px; gap: 16px; }
 .home-footer > p { border-left: 0; padding: 0; flex-basis: 100%; }
 .home-footer nav { margin-left: 0; }
 .home-footer small { flex-basis: 100%; }
}

@media (min-width:651px) and (max-width:1100px) { .home-page .hero::before { background-position: 58% top; } }
@media (max-width:380px) { .home-page .editorial-tiles { gap: 8px; } .home-page .editorial-tiles a { min-height: 125px; padding: 8px; } }

/* Paired editorial module: categories and brands share a single frame. */
.home-page .home-discovery{max-width:none;width:calc(100% - 16px);padding:0;margin:24px auto 40px;grid-template-columns:repeat(2,minmax(0,1fr));gap:0;border:1px solid #293e4c;border-radius:9px;overflow:hidden;background:#09171f}
.home-discovery .inspiration-panel{border:0;border-radius:0;padding:clamp(22px,2.5vw,36px);grid-template-columns:1fr;gap:22px}
.home-discovery .inspiration-copy{max-width:46ch}
.home-discovery .editorial-tiles{gap:10px}
.home-discovery .editorial-tiles a{min-height:140px;aspect-ratio:1.8}
.brand-explorer{min-width:0;border-left:1px solid #293e4c;padding:clamp(24px,3.5vw,52px);display:flex;flex-direction:column;justify-content:center;background:linear-gradient(90deg,#061018eb,#06101880),linear-gradient(0deg,#061018bb,transparent),url('../assets/img/fondo-homepage.png') 70% center / cover}
.brand-explorer h2{font:400 clamp(30px,3.2vw,48px)/1.08 Georgia,serif;letter-spacing:-.025em;color:var(--color-ivory);margin-bottom:32px}
.brand-explorer nav{display:grid;gap:12px;max-width:420px;width:100%}
.brand-explorer nav a{display:flex;justify-content:space-between;align-items:center;gap:16px;min-height:52px;padding:14px 18px;border:1px solid #62717b66;border-radius:3px;background:#08131b80;color:var(--color-ivory);font-size:1rem;transition:border-color var(--transition-quiet),background-color var(--transition-quiet)}
.brand-explorer nav a span{color:var(--color-gold)}
.brand-explorer nav a:hover{border-color:var(--color-gold);background:#10202bba}
@media(max-width:850px){.home-page .home-discovery{grid-template-columns:1fr}.brand-explorer{border-left:0;border-top:1px solid #293e4c;min-height:340px}.home-discovery .editorial-tiles a{aspect-ratio:1.7}}
@media(max-width:380px){.home-discovery .editorial-tiles a{aspect-ratio:1;min-height:125px}}

/* Home proportions across compact and very large screens. */
.home-page .hero-content{max-width:780px}
.home-page .hero h1{overflow-wrap:normal}
.home-page .inspiration-copy{min-width:0}
.home-page .brand-explorer h2{overflow-wrap:anywhere}
@media(min-width:1800px){
 .home-page .featured{grid-template-columns:minmax(0,1fr) minmax(320px,480px)}
 .home-page .product-grid{grid-template-columns:repeat(auto-fill,minmax(220px,1fr))}
 .home-page .home-discovery .editorial-tiles{width:100%;max-width:760px;justify-self:center}
 .home-page .brand-explorer nav{max-width:540px}
}
@media(min-width:651px) and (max-width:950px){
 .home-page .hero-content{width:72%}
 .home-page .hero-signature{right:3%;width:90px}
}
@media(max-width:650px){
 .home-page .hero-content{width:100%}
 .home-page .hero{min-height:420px;height:auto}
 .home-page .hero h1{font-size:clamp(30px,8vw,48px)}
 .home-page .home-benefits li{min-width:0}
}
@media(max-width:359px){
 .home-page .featured .product-grid{grid-template-columns:minmax(0,1fr)}
 .home-page .home-discovery .editorial-tiles a span{font-size:.75rem}
}
