/* home.css — Homepage-specific styles v1 */

/* ── Hero Scroll Hint ─────────────────────────────────── */
.hero__scroll-hint {
    position:absolute; bottom:2.5rem; left:50%; transform:translateX(-50%);
    display:flex; flex-direction:column; align-items:center; gap:.6rem;
    z-index:6; opacity:.5;
}
.hero__scroll-hint span { font-size:.6rem; letter-spacing:.3em; text-transform:uppercase; color:var(--accent); }
.hero__scroll-line { width:1px; height:38px; background:linear-gradient(to bottom,var(--accent),transparent); animation:scrollPulse 1.8s ease-in-out infinite; }
@keyframes scrollPulse { 0%,100%{opacity:.3;transform:scaleY(1)} 50%{opacity:1;transform:scaleY(1.1)} }

/* ── Section wrappers ─────────────────────────────────── */
.home-preview { padding:7rem var(--gap); background:var(--bg); }
.home-preview--dark { background:var(--bg2); }

/* ── About preview ────────────────────────────────────── */
.hp-about { display:flex; align-items:center; gap:5rem; }
.hp-about__img-wrap { position:relative; flex-shrink:0; }
.hp-about__img { width:clamp(260px,35vw,440px); aspect-ratio:3/4; object-fit:cover; display:block; border-radius:4px; }
.hp-about__img-border { position:absolute; inset:-12px 12px 12px -12px; border:1px solid var(--accent-soft); border-radius:4px; z-index:-1; }
@media(max-width:900px){ .hp-about{flex-direction:column;gap:3rem;} .hp-about__img{width:100%;max-width:400px;} }

/* ── Pillar preview (Blueprint row) ──────────────────── */
.hp-pillar__header { margin-bottom:3.5rem; }
.hp-pillar__grid { display:grid; grid-template-columns:repeat(3,1fr); gap:1.5rem; }
.hp-card {
    position:relative; aspect-ratio:1/1.2; overflow:hidden; border-radius:6px;
    text-decoration:none; display:flex; align-items:flex-end;
    border:1px solid var(--border-soft);
    transition:transform .45s var(--ease), box-shadow .45s var(--ease);
}
.hp-card img {
    position:absolute; inset:0; width:100%; height:100%; object-fit:cover;
    transition:transform .45s var(--ease);
}
.hp-card:hover img { transform:scale(1.05); }
.hp-card::before { content:''; position:absolute; inset:0; background:linear-gradient(to top,rgba(0,0,0,.75) 0%,transparent 55%); }
.hp-card:hover { transform:translateY(-7px); box-shadow:var(--shadow); }
.hp-card__inner { position:relative; z-index:1; padding:1.5rem; }
.hp-card__num { display:block; font-family:var(--f-serif); font-size:2.5rem; color:var(--accent); line-height:1; }
.hp-card__label { display:block; font-size:.65rem; letter-spacing:.28em; text-transform:uppercase; color:var(--fg); opacity:.8; margin-top:.4rem; }
@media(max-width:600px){ .hp-pillar__grid{grid-template-columns:1fr 1fr;} }

/* ── Feature (image + text) ───────────────────────────── */
.hp-feature { display:flex; align-items:center; gap:5rem; }
.hp-feature__media { flex:0 0 45%; }
.hp-feature__media img { width:100%; aspect-ratio:4/3; object-fit:cover; border-radius:6px; display:block; }
.hp-feature__text { flex:1; }
.hp-list { list-style:none; margin:1.5rem 0; }
.hp-list li { padding:.55rem 0; border-bottom:1px solid var(--border-soft); font-size:.9rem; color:var(--fg-dim); padding-left:1rem; position:relative; }
.hp-list li::before { content:'✦'; position:absolute; left:0; color:var(--accent); font-size:.6rem; top:.7rem; }
@media(max-width:900px){ .hp-feature{flex-direction:column!important;gap:3rem;} .hp-feature__media{flex:none;width:100%;} }

/* ── Stats ────────────────────────────────────────────── */
.hp-stats { text-align:center; }
.hp-stats__header { margin-bottom:3rem; }
.hp-stats__row { display:flex; justify-content:center; gap:1rem; flex-wrap:wrap; }
.hp-stat { flex:1 1 160px; max-width:200px; padding:2rem 1rem; background:var(--bg-card); border:1px solid var(--border-soft); border-radius:6px; }
.hp-stat__num { font-family:var(--f-serif); font-size:3.5rem; color:var(--accent); line-height:1; }
.hp-stat__label { font-size:.65rem; letter-spacing:.25em; text-transform:uppercase; color:var(--fg-dim); margin-top:.6rem; }

/* ── Quote ────────────────────────────────────────────── */
.hp-quote { max-width:760px; margin:0 auto; text-align:center; }
.hp-quote__inner { padding:4rem 2rem; border:1px solid var(--border-soft); border-radius:8px; background:var(--bg-card); }
.hp-quote__text { font-family:var(--f-serif); font-size:clamp(1.2rem,3vw,1.8rem); font-weight:400; font-style:italic; color:var(--fg); line-height:1.5; }
.hp-quote__cite { display:block; margin-top:1.5rem; font-size:.7rem; letter-spacing:.3em; text-transform:uppercase; color:var(--accent); }

/* ── Banner ────────────────────────────────────────────── */
.hp-banner { text-align:center; }

/* ── YOU section ──────────────────────────────────────── */
.hp-you { display:flex; align-items:center; justify-content:center; }
.hp-you__text { text-align:center; max-width:600px; }

/* ══════════════════════════════════════════════════════
   SHOP / CAROUSEL
   ══════════════════════════════════════════════════════ */
.shop-section { padding:7rem var(--gap); background:var(--bg2); position:relative; z-index:2; }
.shop-header { text-align:center; margin-bottom:4rem; }

/* Vertical Grid for Home Page Showcase */
.shop-grid { 
    display: grid !important; 
    grid-template-columns: repeat(4, 1fr); 
    gap: 2.5rem; 
    margin-top: 4rem;
}

@media(max-width: 1200px) { .shop-grid { grid-template-columns: repeat(3, 1fr); gap: 2rem; } }
@media(max-width: 900px)  { .shop-grid { grid-template-columns: repeat(2, 1fr); gap: 1.5rem; } }
@media(max-width: 480px)  { .shop-grid { grid-template-columns: repeat(2, 1fr); gap: 1rem; } }

.shop-card { background:var(--bg-card); border:1px solid var(--border-soft); border-radius:8px; overflow:hidden; transition:transform .4s var(--ease), box-shadow .4s var(--ease); }
.shop-card:hover { transform:translateY(-8px); box-shadow:var(--shadow); border-color:var(--accent-soft); }

.shop-card__img-wrap { position:relative; aspect-ratio:2/3; overflow:hidden; }
.shop-card__img-wrap img { width:100%; height:100%; object-fit:cover; transition:transform .5s var(--ease); background:var(--bg); }
.shop-card:hover .shop-card__img-wrap img { transform:scale(1.05); }

.shop-card__overlay {
    position:absolute; inset:0; background:rgba(0,0,0,0.3);
    display:flex; align-items:center; justify-content:center;
    opacity:0; transition:opacity .25s var(--ease);
}
.shop-card:hover .shop-card__overlay { opacity:1; }

.shop-card__quick {
    position:absolute; bottom:.8rem; left:50%; transform:translateX(-50%) translateY(6px);
    background:rgba(0,0,0,.75); backdrop-filter:blur(8px);
    color:var(--accent); border:1px solid var(--accent-soft);
    padding:.45rem 1.2rem; border-radius:50px; font-size:.6rem;
    letter-spacing:.15em; text-transform:uppercase; cursor:pointer;
    opacity:0; transition:all .3s; white-space:nowrap;
}
.shop-card:hover .shop-card__quick { opacity:1; transform:translateX(-50%) translateY(0); }

.shop-card__body { padding:1.2rem; }
.shop-card__title { font-family:var(--f-serif); font-size:1rem; color:var(--fg); line-height:1.25; margin-bottom:.3rem; }
.shop-card__author { font-size:.68rem; color:var(--accent); letter-spacing:.15em; text-transform:uppercase; opacity:.8; margin-bottom:1rem; }
.shop-card__footer { display:flex; align-items:center; justify-content:space-between; }
.shop-card__price { font-family:var(--f-serif); font-size:1.1rem; color:var(--accent); font-weight:700; }
.shop-card__cart {
    background:var(--accent); color:#fff; border:none; cursor:pointer;
    padding:.45rem .9rem; border-radius:3px; font-size:.6rem;
    letter-spacing:.12em; text-transform:uppercase; transition:all .3s;
}
.shop-card__cart:hover { opacity:.85; transform:scale(1.05); }

@media(max-width:1200px){ .shop-grid{grid-template-columns:repeat(3,1fr)} }
@media(max-width:768px)  { .shop-grid{grid-template-columns:repeat(2,1fr); gap:1rem} }
@media(max-width:480px)  { .shop-grid{grid-template-columns:repeat(2,1fr); gap:.8rem} }

/* ═══ MODALS AND TOAST HANDLED GLOBALLY BY main.css ═══ */

/* ═══ CONTACT ═══ ─────────────────────────────────────── */
.contact-section { padding:7rem var(--gap); background:var(--bg); }
.contact-grid { display:grid; grid-template-columns:1fr 1.4fr; gap:5rem; align-items:start; }
.social-links { display:flex; flex-direction:column; gap:1rem; }
.social-link {
    display:flex; align-items:flex-start; gap:1rem;
    color:var(--fg-dim); text-decoration:none; font-size:.78rem;
    letter-spacing:.15em;
    padding:.8rem; border:1px solid var(--border-soft); border-radius:6px;
    transition:all .3s var(--ease);
}
.social-link:hover { color:var(--accent); border-color:var(--accent-soft); background:var(--glass-accent); }
.social-icon { width:20px; height:20px; color:var(--accent); flex-shrink:0; margin-top:.1rem; }
.social-label { font-size:.58rem; letter-spacing:.3em; text-transform:uppercase; color:var(--accent); display:block; }
.social-desc { font-size:.68rem; letter-spacing:.05em; text-transform:none; color:var(--fg-dim); line-height:1.5; display:block; margin-top:.15rem; }

.contact-form { display:flex; flex-direction:column; gap:1.4rem; }
.form-group { display:flex; flex-direction:column; gap:.35rem; }
.form-group label {
    font-size:.55rem; letter-spacing:.35em; text-transform:uppercase;
    color:var(--accent); font-family:var(--f-mono, monospace); opacity:.85;
}
.form-group input, .form-group select, .form-group textarea {
    background:transparent; border:none; border-bottom:1px solid var(--border-soft);
    color:var(--fg); padding:.6rem 0; font-family:var(--f-mono, monospace);
    font-size:.82rem; outline:none; resize:none; border-radius:0;
    transition:border-color .3s;
}
.form-group input:focus, .form-group select:focus, .form-group textarea:focus { border-bottom-color:var(--accent); }
.form-group select { cursor:pointer; appearance:none; -webkit-appearance:none; padding-right:1rem; background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6' fill='none'%3E%3Cpath d='M1 1l4 4 4-4' stroke='%23800020' stroke-width='1.5' stroke-linecap='round'/%3E%3C/svg%3E") no-repeat right center; }
.form-group select option { background:var(--bg2); color:var(--fg); }
.form-error { display:none; color:#ff6b4a; font-size:.72rem; text-align:center; font-family:var(--f-mono, monospace); letter-spacing:.1em; margin-top:.25rem; }
.form-error.visible { display:block; }
.form-success { display:none; color:var(--accent); font-size:.72rem; text-align:center; font-family:var(--f-mono, monospace); letter-spacing:.1em; margin-top:.25rem; }
.form-success.visible { display:block; }
@media(max-width:900px){ .contact-grid{grid-template-columns:1fr;gap:3rem;} }

/* ═══ SITE FOOTER ═══────────────────────────────────────*/
.site-footer { border-top:1px solid var(--border-soft); background:var(--bg); }
.footer-top { display:grid; grid-template-columns:1.5fr 1fr 1fr 1fr; gap:3rem; padding:5rem var(--gap) 3.5rem; }
.footer-links-group h4 { font-size:.65rem; letter-spacing:.3em; text-transform:uppercase; color:var(--accent); margin-bottom:1.5rem; }
.footer-links-group ul { list-style:none; display:flex; flex-direction:column; gap:.8rem; }
.footer-links-group a { text-decoration:none; color:var(--fg-dim); font-size:.82rem; transition:color .25s; }
.footer-links-group a:hover { color:var(--accent); }
.footer-bottom { display:flex; align-items:center; justify-content:space-between; padding:1.8rem var(--gap); border-top:1px solid var(--border-soft); flex-wrap:wrap; gap:1rem; }
.footer__copy { font-size:.65rem; letter-spacing:.15em; text-transform:uppercase; color:var(--fg-dim); }
.footer-legal { display:flex; align-items:center; gap:.8rem; }
.footer-legal a { font-size:.65rem; letter-spacing:.12em; text-transform:uppercase; color:var(--fg-dim); text-decoration:none; transition:color .25s; }
.footer-legal a:hover { color:var(--accent); }
.footer-legal span { color:var(--border); }
@media(max-width:900px){ .footer-top{grid-template-columns:1fr 1fr;gap:2rem;} }
@media(max-width:560px){ .footer-top{grid-template-columns:1fr;} .footer-bottom{flex-direction:column;text-align:center;} }