*{margin:0;padding:0;box-sizing:border-box}
html,body{height:100%;overflow-x:hidden;font-family:'Slabo 27px',serif;background:#ffffff}
::-webkit-scrollbar{width:8px}
::-webkit-scrollbar-track{background:#f5f5f5}
::-webkit-scrollbar-thumb{background:#AA8B56;border-radius:4px}

@keyframes fadeInUp{from{opacity:0;transform:translateY(40px)}to{opacity:1;transform:translateY(0)}}
@keyframes slideIn{from{opacity:0;transform:translateX(-30px)}to{opacity:1;transform:translateX(0)}}
@keyframes hoverExpand{from{width:0}to{width:100%}}
@keyframes float{0%,100%{transform:translateY(0)}50%{transform:translateY(-15px)}}
@keyframes shimmer{0%{background-position:-1000px 0}100%{background-position:1000px 0}}
@keyframes rotateCard{0%{transform:rotate(-2deg)}50%{transform:rotate(1deg)}100%{transform:rotate(-2deg)}}
@keyframes pulse-gold{0%,100%{box-shadow:0 0 0 0 rgba(170,139,86,.7)}50%{box-shadow:0 0 0 10px rgba(170,139,86,0)}}

.page{display:none;min-height:100%}
.page.active{display:block}

.hero-gradient{background:linear-gradient(135deg,rgba(170,139,86,.15) 0%,rgba(86,43,8,.05) 100%)}
.editorial-text{font-family:'Playfair Display',serif;font-weight:700;letter-spacing:-1px}
.underline-hover{position:relative;display:inline-block}
.underline-hover::after{content:'';position:absolute;bottom:-4px;left:0;width:0;height:2px;background:#AA8B56;transition:width .4s cubic-bezier(.4,0,.2,1)}
.underline-hover:hover::after{width:100%}

.anim-fade{animation:fadeInUp .8s ease forwards;opacity:0}
.anim-slide{animation:slideIn .8s ease forwards;opacity:0}
.card-hover{transition:all .5s cubic-bezier(.4,0,.2,1);cursor:pointer}
.card-hover:hover{transform:translateY(-8px);box-shadow:0 20px 40px rgba(0,0,0,.1)}

.product-grid{display:grid;grid-template-columns:1fr;gap:3rem}
.product-row{display:grid;grid-template-columns:1.2fr 0.8fr;gap:3rem;align-items:center}
.product-row.reverse{grid-template-columns:0.8fr 1.2fr}
.product-row.reverse>:first-child{order:2}
.product-row.reverse>:last-child{order:1}

.lookbook-card{position:relative;width:100%;aspect-ratio:3/4;border-radius:8px;overflow:hidden;transition:all .6s ease}
.lookbook-card:hover{transform:rotate(0deg) scale(1.05);box-shadow:0 30px 60px rgba(0,0,0,.2)}
.lookbook-card img{width:100%;height:100%;object-fit:cover}

.magazine-header{border-bottom:1px solid #AA8B56;padding:2rem 0;text-align:center}
.editorial-strip{background:#562B08;color:white;padding:.75rem 0;font-size:.85rem;letter-spacing:1px}

.loader{display:inline-block;width:20px;height:20px;border:2px solid #AA8B56;border-right-color:transparent;border-radius:50%;animation:spin .6s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}

.modal-overlay{position:fixed;inset:0;background:rgba(0,0,0,.7);z-index:100;display:none;align-items:center;justify-content:center;backdrop-filter:blur(4px)}
.modal-overlay.active{display:flex}
.modal-content{background:white;border-radius:12px;max-width:600px;width:90%;max-height:85vh;overflow-y:auto;animation:fadeInUp .4s ease}

.stagger-delay-1{animation-delay:.1s}
.stagger-delay-2{animation-delay:.2s}
.stagger-delay-3{animation-delay:.3s}
.stagger-delay-4{animation-delay:.4s}

.text-shadow{text-shadow:2px 2px 8px rgba(0,0,0,.05)}
.luxury-border{border:1px solid rgba(170,139,86,.3)}
  </style>
