/*
Theme Name: Don Alejandro Cigars
Theme URI: https://donalejandrocigar.com
Author: Don Alejandro
Description: A self-owned, open-source WordPress theme for the Don Alejandro cigar catalog. No page-builder lock-in, no premium license, no third-party SaaS dependency. Built for self-hosting (VPS/cPanel).
Version: 1.0.0
Requires at least: 6.0
Requires PHP: 7.4
License: GPLv2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: donalejandro
Tags: full-width-template, custom-menu, custom-logo, translation-ready, rtl-language-support
*/

/* =========================================================
   DESIGN TOKENS — "the cigar box"
   Palette pulled from the Don Alejandro band: aged brass gold,
   deep tobacco-leaf brown, muted cigar-band red, warm parchment.
   ========================================================= */
:root{
  --ink:        #150f0a;   /* near-black espresso — page background */
  --tobacco:    #2b1c12;   /* dark wrapper-leaf brown — section bg */
  --tobacco-2:  #3a2717;   /* lighter panel brown */
  --parchment:  #ede2c8;   /* aged cigar-box paper */
  --parchment-2:#f7f1e2;   /* lighter paper for cards */
  --band-red:   #9c2430;   /* muted cigar-band red */
  --band-red-d: #7a1c26;   /* darker red for hover */
  --gold:       #c6a24d;   /* brass foil accent */
  --gold-soft:  #a9884a;   /* muted gold for rules/text on light */
  --smoke:      #a89a83;   /* muted taupe secondary text on dark */
  --line:       rgba(198,162,77,0.25);

  --font-display: "Playfair Display", "Amiri", Georgia, "Times New Roman", serif;
  --font-body: "Cairo", "Segoe UI", Tahoma, Arial, sans-serif;

  --radius: 2px;
  --container: 1180px;
  --gap: clamp(1.5rem, 3vw, 3rem);
}

@font-face{
  font-family:"Playfair Display";
  src:url("assets/fonts/playfair-400.woff2") format("woff2");
  font-weight:400; font-style:normal; font-display:swap;
}
@font-face{
  font-family:"Playfair Display";
  src:url("assets/fonts/playfair-700.woff2") format("woff2");
  font-weight:700; font-style:normal; font-display:swap;
}
@font-face{
  font-family:"Playfair Display";
  src:url("assets/fonts/playfair-italic-400.woff2") format("woff2");
  font-weight:400; font-style:italic; font-display:swap;
}
@font-face{
  font-family:"Playfair Display";
  src:url("assets/fonts/playfair-italic-700.woff2") format("woff2");
  font-weight:700; font-style:italic; font-display:swap;
}
@font-face{
  font-family:"Cairo";
  src:url("assets/fonts/cairo-400.woff2") format("woff2");
  font-weight:400; font-style:normal; font-display:swap;
}
@font-face{
  font-family:"Cairo";
  src:url("assets/fonts/cairo-700.woff2") format("woff2");
  font-weight:700; font-style:normal; font-display:swap;
}

/* =========================================================
   RESET / BASE
   ========================================================= */
*,*::before,*::after{box-sizing:border-box;}
html{scroll-behavior:smooth;}
@media (prefers-reduced-motion: reduce){
  html{scroll-behavior:auto;}
  *,*::before,*::after{animation-duration:0.01ms !important; transition-duration:0.01ms !important;}
}
body{
  margin:0;
  background:var(--ink);
  color:var(--parchment);
  font-family:var(--font-body);
  font-size:16px;
  line-height:1.65;
  -webkit-font-smoothing:antialiased;
}
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{
  font-family:var(--font-display);
  font-weight:700;
  line-height:1.15;
  margin:0 0 0.5em;
  color:var(--parchment-2);
  letter-spacing:0.01em;
}
:lang(ar) h1, :lang(ar) h2, :lang(ar) h3, :lang(ar) h4{
  font-family:var(--font-body);
}
p{margin:0 0 1.2em;}
.container{
  max-width:var(--container);
  margin-inline:auto;
  padding-inline:clamp(1.25rem, 4vw, 2.5rem);
}
:focus-visible{outline:2px solid var(--gold); outline-offset:3px;}

/* eyebrow / label */
.eyebrow{
  display:inline-flex;
  align-items:center;
  gap:0.6em;
  font-size:0.78rem;
  letter-spacing:0.22em;
  text-transform:uppercase;
  color:var(--gold);
  font-weight:700;
  margin-bottom:1em;
}
.eyebrow::before{
  content:"";
  width:22px; height:1px;
  background:var(--gold);
}

/* buttons */
.btn{
  display:inline-flex;
  align-items:center;
  gap:0.6em;
  padding:0.9em 1.7em;
  border-radius:var(--radius);
  font-weight:700;
  font-size:0.92rem;
  letter-spacing:0.03em;
  border:1px solid transparent;
  cursor:pointer;
  transition:background .25s ease, color .25s ease, border-color .25s ease, transform .2s ease;
}
.btn-gold{
  background:var(--gold);
  color:var(--ink);
}
.btn-gold:hover{background:var(--parchment-2); transform:translateY(-1px);}
.btn-outline{
  background:transparent;
  color:var(--parchment-2);
  border-color:var(--line);
}
.btn-outline:hover{border-color:var(--gold); color:var(--gold);}
.btn-whatsapp{
  background:#25D366;
  color:#0c1f14;
}
.btn-whatsapp:hover{background:#1ebd5a;}

/* cigar-band rule — signature divider */
.band-rule{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:1rem;
  margin:0 auto;
  width:100%;
}
.band-rule::before,.band-rule::after{
  content:"";
  flex:1;
  height:1px;
  background:linear-gradient(90deg, transparent, var(--line) 50%, transparent);
}
.band-rule__seal{
  width:34px; height:34px;
  border:1px solid var(--gold);
  border-radius:50%;
  display:flex; align-items:center; justify-content:center;
  color:var(--gold);
  font-family:var(--font-display);
  font-style:italic;
  font-size:0.85rem;
}

/* Skip link */
.skip-link{
  position:absolute; left:-9999px; top:auto;
  background:var(--gold); color:var(--ink); padding:0.75em 1.25em; z-index:9999;
}
.skip-link:focus{left:1rem; top:1rem;}

/* RTL logical adjustments handled mostly by logical CSS properties above (margin-inline, padding-inline) */
[dir="rtl"] .eyebrow::before{order:2;}

/* =========================================================
   HEADER
   ========================================================= */
.site-header{
  position:sticky; top:0; z-index:100;
  background:rgba(21,15,10,0.92);
  backdrop-filter:blur(6px);
  border-bottom:1px solid var(--line);
}
.site-header__row{
  display:flex; align-items:center; justify-content:space-between;
  gap:2rem; padding-block:0.9rem;
}
.site-header__logo img{max-height:56px; width:auto;}
.site-header__wordmark{
  font-family:var(--font-display); font-style:italic; font-weight:700;
  font-size:1.4rem; color:var(--band-red);
}
.site-header__nav{flex:1; display:flex; justify-content:center;}
.primary-menu{display:flex; gap:2.2rem;}
.primary-menu a{
  font-size:0.88rem; letter-spacing:0.04em; text-transform:uppercase;
  color:var(--parchment); font-weight:600; position:relative; padding-block:0.3rem;
}
.primary-menu a:hover{color:var(--gold);}
.primary-menu .current-menu-item > a{color:var(--gold);}
.site-header__actions{display:flex; align-items:center; gap:1rem;}
.btn-sm{padding:0.55em 1.1em; font-size:0.8rem;}
.site-header__lang a{font-size:0.8rem; opacity:0.85; margin-inline-end:0.4rem;}
.nav-toggle{
  display:none; flex-direction:column; gap:5px;
  background:none; border:0; cursor:pointer; padding:6px;
}
.nav-toggle span{width:22px; height:2px; background:var(--gold); display:block;}
.sr-only{position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0,0,0,0);}
.mobile-nav{
  display:none;
  border-top:1px solid var(--line);
  background:var(--ink);
}
.mobile-menu{display:flex; flex-direction:column; padding:1rem 1.25rem;}
.mobile-menu a{display:block; padding:0.75em 0; border-bottom:1px solid var(--line); font-size:0.95rem;}

@media (max-width: 880px){
  .site-header__nav{display:none;}
  .nav-toggle{display:flex;}
  .mobile-nav[aria-hidden="false"], .mobile-nav.is-open{display:block;}
}

/* =========================================================
   HERO
   ========================================================= */
.hero{
  position:relative;
  min-height:min(88vh, 780px);
  display:flex; align-items:center;
  background:
    linear-gradient(180deg, rgba(21,15,10,0.35), rgba(21,15,10,0.92)),
    var(--hero-img, linear-gradient(160deg, #2b1c12, #150f0a 65%));
  background-size:cover;
  background-position:center;
  overflow:hidden;
}
.hero::after{
  content:"";
  position:absolute; inset:0;
  background:radial-gradient(ellipse at 30% 20%, rgba(198,162,77,0.10), transparent 55%);
  pointer-events:none;
}
.hero__inner{position:relative; z-index:2; max-width:760px;}
.hero__title{
  font-size:clamp(2.6rem, 6vw, 4.6rem);
  font-style:italic;
  color:var(--parchment-2);
  margin-bottom:0.25em;
}
.hero__tagline{
  font-family:var(--font-display); font-style:italic; font-size:1.35rem;
  color:var(--gold); margin-bottom:1.6em;
}
.hero__cta{display:flex; flex-wrap:wrap; gap:1rem;}

/* =========================================================
   SECTIONS / SHARED
   ========================================================= */
.section{padding-block:clamp(3.5rem, 8vw, 6.5rem);}
.section--intro{background:var(--tobacco);}
.section-head{margin-bottom:2.5rem;}
.section-head--center{text-align:center;}
.section-head h2{font-size:clamp(1.8rem, 3vw, 2.5rem);}
.content-narrow{max-width:760px; margin-inline:auto;}
.link-more{
  color:var(--gold); font-weight:700; font-size:0.9rem;
  border-bottom:1px solid transparent;
}
.link-more:hover{border-color:var(--gold);}
.empty-note{color:var(--smoke); font-style:italic;}

/* Intro / brand story */
.intro-grid{display:grid; grid-template-columns:0.85fr 1.15fr; gap:var(--gap); align-items:center;}
.frame-figure{
  background:var(--tobacco-2);
  border:1px solid var(--line);
  padding:2.5rem;
  display:flex; align-items:center; justify-content:center;
  aspect-ratio:1/1;
}
.frame-figure img{max-height:220px; width:auto;}
@media (max-width: 860px){
  .intro-grid{grid-template-columns:1fr; text-align:center;}
  .frame-figure{max-width:280px; margin-inline:auto;}
}

/* =========================================================
   CIGAR GRID / CARD
   ========================================================= */
.cigar-grid{
  display:grid;
  grid-template-columns:repeat(auto-fill, minmax(230px, 1fr));
  gap:1.75rem;
}
.cigar-card{
  background:var(--tobacco-2);
  border:1px solid var(--line);
  overflow:hidden;
  transition:transform .25s ease, border-color .25s ease;
}
.cigar-card:hover{transform:translateY(-4px); border-color:var(--gold);}
.cigar-card__media{
  position:relative; display:flex; align-items:center; justify-content:center;
  aspect-ratio:4/5; background:radial-gradient(ellipse at 50% 30%, var(--tobacco) 0%, var(--ink) 100%);
  overflow:hidden; padding:1.5rem 1rem;
}
.cigar-card__media img{width:auto; height:100%; max-width:100%; object-fit:contain; transition:transform .5s ease;}
.cigar-card:hover .cigar-card__media img{transform:scale(1.04);}
.cigar-card__placeholder{display:block; width:100%; height:100%; background:repeating-linear-gradient(45deg, var(--tobacco), var(--tobacco) 10px, var(--tobacco-2) 10px, var(--tobacco-2) 20px);}
.cigar-card__seal{
  position:absolute; top:0.75rem; inset-inline-end:0.75rem;
  background:rgba(21,15,10,0.85); color:var(--gold);
  font-size:0.72rem; letter-spacing:0.03em;
  padding:0.35em 0.6em; border:1px solid var(--gold);
  border-radius:2px;
}
.cigar-card__body{padding:1.1rem 1.2rem 1.3rem;}
.cigar-card__vitola{font-size:0.72rem; letter-spacing:0.12em; text-transform:uppercase; color:var(--gold-soft); margin-bottom:0.35em;}
.cigar-card__title{font-size:1.15rem; margin-bottom:0.5em;}
.cigar-card__title a:hover{color:var(--gold);}

/* Collections */
.collection-grid{
  display:grid; grid-template-columns:repeat(auto-fit, minmax(200px,1fr)); gap:1.25rem; margin-top:2.5rem;
}
.collection-card{
  display:flex; flex-direction:column; gap:0.4rem;
  padding:1.6rem 1.4rem; text-align:center;
  border:1px solid var(--line); background:var(--tobacco-2);
  transition:border-color .2s ease, transform .2s ease;
}
.collection-card:hover{border-color:var(--gold); transform:translateY(-3px);}
.collection-card__name{font-family:var(--font-display); font-size:1.2rem; font-style:italic; color:var(--parchment-2);}
.collection-card__count{font-size:0.78rem; color:var(--smoke);}

/* CTA band */
.section--cta{background:var(--band-red); background-image:linear-gradient(160deg, var(--band-red), var(--band-red-d));}
.cta-band{display:flex; justify-content:space-between; align-items:center; gap:2rem; flex-wrap:wrap;}
.cta-band h2, .cta-band p{color:var(--parchment-2);}
.cta-band .eyebrow{color:#f2d98a;}
.cta-band__actions{display:flex; gap:1rem; flex-wrap:wrap;}

/* =========================================================
   PAGE HEADER (archives/pages)
   ========================================================= */
.page-header{
  padding-block:3.5rem 2rem;
  background:var(--tobacco);
  border-bottom:1px solid var(--line);
  text-align:center;
}
.page-header h1{font-size:clamp(2rem, 4vw, 3rem); font-style:italic;}
.page-header__desc{max-width:640px; margin-inline:auto; color:var(--smoke);}

/* Catalogue layout */
.catalogue-layout{display:grid; grid-template-columns:220px 1fr; gap:var(--gap); align-items:start;}
.catalogue-filters h4{font-size:0.85rem; text-transform:uppercase; letter-spacing:0.08em; color:var(--gold); margin-bottom:0.6em; margin-top:1.4em;}
.catalogue-filters h4:first-child{margin-top:0;}
.filter-list a{display:block; padding:0.4em 0; color:var(--smoke); font-size:0.92rem;}
.filter-list a:hover, .filter-list a.is-active{color:var(--gold);}
@media (max-width: 880px){ .catalogue-layout{grid-template-columns:1fr;} }
.pagination{margin-top:2.5rem; display:flex; gap:0.5rem; justify-content:center;}
.pagination .page-numbers{padding:0.5em 0.9em; border:1px solid var(--line);}
.pagination .current{border-color:var(--gold); color:var(--gold);}

/* =========================================================
   SINGLE CIGAR
   ========================================================= */
.cigar-single{padding-block:3rem 1rem;}
.cigar-single__grid{display:grid; grid-template-columns:1.05fr 1fr; gap:var(--gap); align-items:start;}
.cigar-single__media{
  display:flex; align-items:center; justify-content:center;
  min-height:420px;
  background:radial-gradient(ellipse at 50% 25%, var(--tobacco-2) 0%, var(--ink) 100%);
  border:1px solid var(--line); padding:2rem;
}
.cigar-single__media img{max-height:640px; width:auto; object-fit:contain; border:0;}
.cigar-single__gallery{display:flex; gap:0.6rem; margin-top:0.8rem; flex-wrap:wrap;}
.cigar-single__thumb{width:64px; height:64px; overflow:hidden; border:1px solid var(--line);}
.cigar-single__thumb img{width:100%; height:100%; object-fit:cover;}
.cigar-single__lede{font-size:1.05rem; color:var(--smoke);}
.cigar-single__price{color:var(--gold); font-weight:700;}
.cigar-single__cta{display:flex; gap:1rem; flex-wrap:wrap; margin:1.5rem 0 2rem;}
.cigar-single__content{border-top:1px solid var(--line); padding-top:1.5rem; margin-top:0.5rem;}
@media (max-width: 880px){ .cigar-single__grid{grid-template-columns:1fr;} }

.spec-sheet{margin:1.5rem 0; border-top:1px solid var(--line);}
.spec-sheet__row{display:flex; justify-content:space-between; padding:0.6em 0; border-bottom:1px solid var(--line); font-size:0.92rem;}
.spec-sheet__row dt{color:var(--smoke);}
.spec-sheet__row dd{margin:0; font-weight:700; color:var(--parchment-2);}

/* =========================================================
   CONTACT / FORMS
   ========================================================= */
.contact-grid{display:grid; grid-template-columns:1.3fr 0.8fr; gap:var(--gap); align-items:start;}
@media (max-width: 880px){ .contact-grid{grid-template-columns:1fr;} }
.da-contact-form{display:flex; flex-direction:column; gap:1.1rem; margin-top:1.5rem;}
.form-row{display:flex; flex-direction:column; gap:0.4rem;}
.form-row label{font-size:0.85rem; color:var(--gold-soft);}
.form-row input, .form-row textarea{
  background:var(--tobacco-2); border:1px solid var(--line); color:var(--parchment-2);
  padding:0.8em 0.9em; font-family:var(--font-body); font-size:0.95rem; border-radius:var(--radius);
}
.form-row input:focus, .form-row textarea:focus{border-color:var(--gold); outline:none;}
.hp-field{position:absolute; left:-9999px;}
.form-notice{padding:1em 1.2em; margin-bottom:1.5rem; border-radius:var(--radius); font-size:0.92rem;}
.form-notice--success{background:rgba(37,211,102,0.12); border:1px solid #25D366; color:#8fe9b4;}
.form-notice--error{background:rgba(156,36,48,0.15); border:1px solid var(--band-red); color:#f3b7bb;}
.footer-contact li{padding:0.3em 0; color:var(--smoke); font-size:0.92rem;}

/* =========================================================
   FOOTER
   ========================================================= */
.site-footer{background:var(--tobacco); padding-top:3rem; border-top:1px solid var(--line);}
.site-footer__grid{display:grid; grid-template-columns:1.4fr 1fr 1fr 1fr; gap:var(--gap); padding-block:2.5rem;}
.site-footer__tagline{font-style:italic; color:var(--gold); font-family:var(--font-display);}
.site-footer__socials a{color:var(--smoke); font-size:0.85rem;}
.site-footer__socials a:hover{color:var(--gold);}
.footer-widget__title, .site-footer__col h4{font-size:0.85rem; text-transform:uppercase; letter-spacing:0.08em; color:var(--gold); margin-bottom:1em;}
.footer-menu a, .footer-widget a{display:block; padding:0.3em 0; color:var(--smoke); font-size:0.92rem;}
.footer-menu a:hover, .footer-widget a:hover{color:var(--gold);}
@media (max-width: 880px){ .site-footer__grid{grid-template-columns:1fr 1fr;} }
@media (max-width: 560px){ .site-footer__grid{grid-template-columns:1fr;} }
.site-footer__bottom{border-top:1px solid var(--line); padding-block:1.25rem; margin-top:1rem;}
.site-footer__bottom-row{display:flex; justify-content:space-between; flex-wrap:wrap; gap:0.5rem; font-size:0.8rem; color:var(--smoke);}
.site-footer__bottom-row p{margin:0;}

/* Lightbox (used by assets/js/main.js) */
.da-lightbox{
  position:fixed; inset:0; z-index:9999;
  background:rgba(10,7,4,0.92);
  display:flex; align-items:center; justify-content:center;
  padding:2rem;
}
.da-lightbox img{max-width:min(90vw, 900px); max-height:85vh; border:1px solid var(--gold);}
.da-lightbox__close{
  position:absolute; top:1.25rem; inset-inline-end:1.5rem;
  background:none; border:1px solid var(--gold); color:var(--gold);
  width:40px; height:40px; border-radius:50%; font-size:1.4rem; line-height:1; cursor:pointer;
}
