


:root{
  --beige:#fbf7f1;
  --cream:#fffaf6;
  --tan:#e6c9bc;
  --mocha:#c9a792;
  --ink:#6a5448;
  --outline:#e0cfc4;
  --radius:22px;
  --shadow:0 14px 36px rgba(122,93,76,.10);
}
html,body{background:var(--beige);color:var(--ink)}
a{color:#7a5d4c}
.btn{border:2px solid var(--outline);border-radius:999px;background:var(--tan);color:#513a2f;font-weight:800}
.btn:hover{filter:brightness(0.98)}
.site-header{position: relative;background:linear-gradient(180deg,var(--cream),var(--beige));border-bottom:2px solid rgba(224,207,196,.6);backdrop-filter:saturate(120%) blur(6px);z-index:20}
.page{max-width:1100px;margin:0 auto;padding:36px 18px}
.tiles{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:20px}
.tile{position:relative;display:block;border:2px solid var(--outline);border-radius:22px;overflow:hidden;background:var(--cream);box-shadow:var(--shadow);text-decoration:none}
.tile img{width:100%;height:260px;object-fit:cover;display:block}
.tile .overlay{position:absolute;left:0;right:0;bottom:0;background:linear-gradient(180deg,transparent,rgba(0,0,0,.28));padding:14px}
.tile .title{font-family:'Playfair Display', serif;font-weight:900;letter-spacing:.4px;color:#fff;text-shadow:0 2px 6px rgba(0,0,0,.3);}
@media(max-width:640px){.tile img{height:200px}}
.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:16px}
.grid a{display:block;border:2px solid var(--outline);border-radius:18px;overflow:hidden;background:#fff;box-shadow:var(--shadow)}
.grid img{width:100%;aspect-ratio:3/2;object-fit:cover;display:block}
.notice{color:#7b6254;margin:.5rem 0 .75rem;font-size:.95rem}
html,body{background:var(--beige);color:var(--ink);}
a{color:var(--brown-deep)}
.btn{border:2px solid var(--outline);border-radius:999px;background:var(--cream);font-weight:700}
.btn.primary{background:var(--pink-brown)}
.btn.whatsapp{background:var(--brown-light);color:#fff;border-color:var(--brown-deep)}
.site-header{position: relative;background:linear-gradient(180deg,var(--cream),var(--beige));border-bottom:2px solid rgba(139,94,60,.12);backdrop-filter:saturate(120%) blur(6px);z-index:20}
.page{max-width:1100px;margin:0 auto;padding:40px 20px}
.collections{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:16px}
.collection{border:2px solid var(--outline);border-radius:var(--radius);overflow:hidden;background:#fff}
.collection .thumbs{display:grid;grid-template-columns:repeat(3,1fr);gap:2px;padding:12px}
.collection .thumbs img{aspect-ratio:1/1;object-fit:cover;border:2px solid rgba(139,94,60,.10)}
.collection a.folder-link{display:block;padding:12px 16px;border-top:2px dashed rgba(139,94,60,.25);background:var(--cream);font-weight:700}
.notice{color:#5f4432;margin:.5rem 0 0.75rem;font-size:.95rem}
@media (max-width: 820px){.collections{grid-template-columns:repeat(auto-fit,minmax(160px,1fr))}}
.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:10px}
.grid img{width:100%;height:240px;object-fit:cover;border:2px solid var(--outline);border-radius:var(--radius);background:#fff;box-shadow:var(--shadow)}
@media(max-width:600px){.grid img{height:180px}}
html,body{background:var(--beige);color:var(--ink);}
a{color:var(--brown-deep)}
.btn{border:2px solid var(--outline);border-radius:999px;background:var(--cream);font-weight:700}
.btn.primary{background:var(--pink-brown)}
.btn.whatsapp{background:var(--brown-light);color:#fff;border-color:var(--brown-deep)}
.site-header{position: relative;background:linear-gradient(180deg,var(--cream),var(--beige));border-bottom:2px solid rgba(127,85,57,.12);backdrop-filter:saturate(120%) blur(6px);z-index:20}
.page{max-width:1100px;margin:0 auto;padding:40px 20px}
.collections{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:16px}
.collection{border:2px solid var(--outline);border-radius:var(--radius);overflow:hidden;background:#fff}
.collection .thumbs{display:grid;grid-template-columns:repeat(3,1fr);gap:2px;padding:12px}
.collection .thumbs img{aspect-ratio:1/1;object-fit:cover;border:2px solid rgba(127,85,57,.08)}
.collection a.folder-link{display:block;padding:12px 16px;border-top:2px dashed rgba(127,85,57,.25);background:var(--cream);font-weight:700}
@media (max-width: 820px){.collections{grid-template-columns:repeat(auto-fit,minmax(160px,1fr))}}
.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:10px}
.grid img{width:100%;height:240px;object-fit:cover;border:2px solid var(--outline);border-radius:var(--radius);background:#fff;box-shadow:var(--shadow)}
@media(max-width:600px){.grid img{height:180px}}

/* existing styles below (kept) */

:root{
  --espresso:#4e342e; --cocoa:#6d4c41; --rose:#d7a7a3; --beige:#f6efe9;
  --cream:#fff8f2; --ink:#2b1d19; --accent:#b37b6d; --outline: var(--espresso);
  --radius: 16px; --shadow: 0 10px 30px rgba(46, 27, 22, .08);
}
html,body{background:var(--beige);color:var(--ink);}
a{color:var(--espresso)}
.btn{border:2px solid var(--outline);border-radius:999px;background:var(--cream);font-weight:700}
.btn.primary{background:var(--rose)}
.btn.whatsapp{background:var(--accent);color:#fff;border-color:var(--espresso)}
.site-header{position: relative;background:linear-gradient(180deg,var(--cream),var(--beige));border-bottom:2px solid rgba(78,52,46,.1);backdrop-filter:saturate(120%) blur(6px);z-index:20}
.page{max-width:1100px;margin:0 auto;padding:40px 20px}
.collections{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:16px}
.collection{border:2px solid var(--outline);border-radius:var(--radius);overflow:hidden;background:#fff}
.collection .thumbs{display:grid;grid-template-columns:repeat(3,1fr);gap:2px;padding:12px}
.collection .thumbs img{aspect-ratio:1/1;object-fit:cover;border:2px solid rgba(78,52,46,.08)}
.collection a.folder-link{display:block;padding:12px 16px;border-top:2px dashed rgba(78,52,46,.2);background:var(--cream);font-weight:700}
@media (max-width: 820px){.collections{grid-template-columns:repeat(auto-fit,minmax(160px,1fr))}}
.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:10px}
.grid img{width:100%;height:240px;object-fit:cover;border:2px solid var(--outline);border-radius:var(--radius);background:#fff;box-shadow:var(--shadow)}
@media(max-width:600px){.grid img{height:180px}}

/* existing styles below */

:root{
  --bg-beige: #f5efe6;
  --soft-brown: #8b6b4a;
  --accent-gold: #caa973;
  --accent-gold-dark: #b38b51;
  --text-dark: #2f2a27;
  --muted: #7a6b5f;
  --white: #ffffff;
}
body{
  background: var(--bg-beige);
  color: var(--text-dark);
  font-family: 'Cormorant Garamond', serif;
  line-height: 1.6;
}
h1,h2,h3{
  font-family: 'Playfair Display', serif;
  letter-spacing: 0.4px;
  color: var(--soft-brown);
}
.header, header{
  background: transparent;
}
.vintage-frame{
  border: 1px solid rgba(179,139,81,0.12);
  background: linear-gradient(180deg, rgba(255,255,255,0.4), rgba(250,245,240,0.6));
  box-shadow: 0 6px 18px rgba(45,35,25,0.06);
  padding: 1rem;
  border-radius: 12px;
}
.hero-photo img{
  max-width: 100%;
  height: auto;
  display: block;
  border-radius: 10px;
  border: 6px solid rgba(234,224,212,0.6);
}
/* Buttons: white with gold frame OR gold filled */
.btn{
  display: inline-block;
  padding: 0.6rem 1rem;
  border-radius: 999px;
  text-decoration: none;
  font-weight: 600;
  transition: transform .18s ease, box-shadow .18s ease;
  box-shadow: 0 4px 12px rgba(45,35,25,0.06);
}
.btn:hover{ transform: translateY(-3px); }
.btn.whatsapp{
  background: var(--white);
  color: var(--soft-brown);
  border: 2px solid var(--accent-gold);
  box-shadow: 0 6px 18px rgba(202,169,115,0.12);
  padding-left: 1rem;
  padding-right: 1rem;
}
.btn.primary{
  background: linear-gradient(180deg, var(--accent-gold), var(--accent-gold-dark));
  color: var(--white);
  border: 2px solid rgba(0,0,0,0.04);
}
.cta-row{ display:flex; gap:0.6rem; align-items:center; flex-wrap:wrap; }

/* Terms modal tweaks for subtle look */
#consent-overlay.active{ display:flex; align-items:center; justify-content:center; background: rgba(15,10,5,0.5); position:fixed; inset:0; z-index:9999; }
.consent-card{ background: var(--white); padding:1.2rem; border-radius:10px; max-width:520px; box-shadow: 0 18px 40px rgba(30,20,10,0.12); border:1px solid rgba(179,139,81,0.08); }

/* Make site responsive */
@media (max-width:720px){
  .intro-card{ padding:0.6rem; }
  .cta-row{ flex-direction:column; align-items:stretch; }
  .btn{ width:100%; text-align:center; }
  .hero-photo img{ border-radius:8px; }
  nav{ font-size:0.95rem; }
}


/* Polished theme: Deep brown + beige with glowing gold carved frames */
/* Fonts applied via index.html imports (Playfair, Cinzel Decorative, Raleway) */
:root{
  --bg-deep: #21130e; /* deep moody brown */
  --beige: #efe5d7;
  --paper: #2b1f16;
  --accent-gold: #d7b24a;
  --accent-gold-2: #b8872b;
  --muted:#a8907b;
  --frame-width:12px;
  --radius:20px;
  --shadow-glow: 0 18px 50px rgba(215,178,74,0.12);
  --glass: rgba(255,255,255,0.035);
  font-family: 'Raleway', sans-serif;
}
*{box-sizing:border-box}
body{
  margin:0;
  background: radial-gradient(circle at 10% 10%, rgba(215,178,74,0.03), transparent 10%),
              linear-gradient(180deg,var(--bg-deep), #140a07);
  color:var(--beige);
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
  padding-bottom:60px;
}
/* header */
header{display:flex;align-items:center;justify-content:space-between;padding:18px 20px}
.brand{display:flex;gap:12px;align-items:center}
.brand .logo{width:56px;height:56px;border-radius:50%;background:linear-gradient(180deg,var(--accent-gold),var(--accent-gold-2));display:flex;align-items:center;justify-content:center;color:#24160f;font-weight:700;font-family:'Cinzel Decorative'}
.brand .title{font-family:'Playfair Display';font-size:20px;color:var(--beige)}
/* hero */
.main-hero{padding:18px 20px}
.hero-grid{display:grid;grid-template-columns:1fr;gap:18px}
.hero-title{font-family:'Playfair Display';font-size:34px;line-height:1.02;color:var(--beige);text-shadow:0 8px 30px rgba(0,0,0,0.6)}
.hero-sub{max-width:640px;color:var(--beige);opacity:0.9}
/* ornate frame wrapper */
.vintage-frame{
  background:linear-gradient(180deg, rgba(255,255,255,0.02), transparent);
  padding:18px;
  border-radius:var(--radius);
  box-shadow:var(--shadow-glow), inset 0 2px 8px rgba(0,0,0,0.6);
  border: solid var(--frame-width) transparent;
  position:relative;
  overflow:hidden;
}
.vintage-frame::before{
  content:'';
  position:absolute;inset:0;pointer-events:none;
  border-radius:calc(var(--radius) + 8px);
  padding:8px;
  background:
    conic-gradient(from 180deg at 50% 50%, rgba(215,178,74,0.12), transparent 30%),
    linear-gradient(180deg, rgba(215,178,74,0.05), transparent 40%);
  mix-blend-mode:screen;
  filter:blur(6px);
}
/* photo inside frame */
.hero-photo-box{border-radius:14px;overflow:hidden;border:6px solid rgba(215,178,74,0.18);background:#160d0a}
.hero-photo-box img{width:100%;height:auto;display:block;object-fit:cover}
/* buttons - polished gold border, glow on hover */
.btn{display:inline-flex;align-items:center;gap:8px;padding:10px 16px;border-radius:999px;border:2px solid var(--accent-gold-2);background:transparent;color:var(--beige);cursor:pointer;transition:transform .12s,box-shadow .12s}
.btn.primary{background:linear-gradient(180deg,var(--accent-gold),var(--accent-gold-2));color:#24160f;font-weight:700}
.btn:hover{transform:translateY(-3px);box-shadow:0 18px 50px rgba(184,135,43,0.18), inset 0 0 40px rgba(255,245,200,0.02)}
/* gallery */
.collections{display:grid;grid-template-columns:1fr;gap:12px;margin-top:18px}
.thumbs{display:flex;gap:8px;flex-wrap:wrap}
.thumbs img{width:100%;height:120px;object-fit:cover;border-radius:10px;border:3px solid rgba(0,0,0,0.35)}
/* modal / terms */
.overlay{position:fixed;inset:0;display:flex;align-items:center;justify-content:center;padding:20px}
.modal{background:linear-gradient(180deg,#2a1b14,#1b0f0b);color:var(--beige);border-radius:12px;padding:18px;border:4px solid rgba(215,178,74,0.12);box-shadow:0 30px 80px rgba(0,0,0,0.7);max-width:900px}
.modal h2{font-family:'Playfair Display';font-size:22px;color:var(--beige);margin-top:0}
.full-terms-content{max-height:56vh;overflow:auto;padding:12px;background:linear-gradient(180deg, rgba(255,255,255,0.02), transparent);border-radius:8px}
/* responsive */
@media(min-width:800px){
  .hero-grid{grid-template-columns:1fr 480px}
  .thumbs img{height:140px}
  .collections{grid-template-columns:repeat(2,1fr)}
}
@media(min-width:1100px){
  .collections{grid-template-columns:repeat(4,1fr)}
}

#agree-section {
  background: #f5f0e6;
  border-top: 1px solid #d3b78f;
  margin-top: 50px;
}
.royal-btn {
  background-color: #fff;
  border: 2px solid #d3b78f;
  color: #8b6c42;
  padding: 12px 28px;
  font-size: 1.1rem;
  border-radius: 30px;
  transition: all 0.3s ease;
  font-family: 'Playfair Display', serif;
}
.royal-btn:hover {
  background-color: #d3b78f;
  color: white;
  transform: translateY(-2px);
}

.wa-badge{font-weight:700; padding:8px 12px; display:inline-block; background:var(--cream); border:2px solid var(--outline); border-radius:999px; box-shadow:var(--shadow); margin:8px 20px}
.wa-badge a{text-decoration:none; color:var(--brown-deep)}

.folder-title{
  font-family:'Playfair Display', serif;
  font-weight:800;
  font-size:1.1rem;
  color:var(--brown-deep);
  padding:10px 14px;
  background:linear-gradient(180deg,var(--cream),rgba(255,255,255,.6));
  border-top:2px dashed rgba(0,0,0,0.06);
}
.collection h3{font-family:'Playfair Display', serif; font-weight:900; color:var(--brown-deep); letter-spacing:.4px}

/* Simple large tiles */
.collections.tiles{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:22px}
.tile{display:block;border:2px solid var(--outline);border-radius:20px;overflow:hidden;background:var(--cream);box-shadow:var(--shadow);text-decoration:none}
.tile img{width:100%;height:240px;object-fit:cover;display:block}
.tile-title{padding:12px 14px;font-family:'Playfair Display', serif;font-weight:900;letter-spacing:.3px;color:var(--brown-deep);background:linear-gradient(180deg,var(--cream),rgba(255,255,255,.7));}
@media(max-width:600px){.tile img{height:180px}}
/* Button tone consistency */
.btn.whatsapp{background:var(--pink-brown);border-color:var(--brown-deep);color:#3b2a22}
.btn.whatsapp:hover{filter:brightness(0.98)}
.agree-cta{margin-top:14px;text-align:center}
