/* ============================================================
   MOVE TO PORTUGAL — shared design system
   Warm Mediterranean editorial, adapted for modern ecommerce
   ============================================================ */

@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,300;0,400;0,500;0,600;0,700;1,400;1,500;1,600&family=Jost:wght@300;400;500;600&display=swap');

:root{
  /* palette */
  --paper:#F5EEE2;
  --paper-2:#EDE3D4;
  --card:#FBF7EF;
  --card-2:#FFFDF8;
  --ink:#2C2620;
  --ink-soft:#6E6356;
  --ink-faint:#9A9082;
  --terracotta:#B05B39;
  --terracotta-dk:#974A2C;
  --clay:#C7895C;
  --azulejo:#34566E;
  --azulejo-dk:#26415380;
  --sand:#E7D9C2;
  --olive:#6E7355;
  --gold:#C29A4B;
  --line:rgba(44,38,32,.16);
  --line-soft:rgba(44,38,32,.09);
  --good:#4E7A52;

  /* type scale (web) */
  --font-display:'Cormorant Garamond', Georgia, serif;
  --font-sans:'Jost', system-ui, sans-serif;

  /* shadows */
  --sh-sm:0 1px 2px rgba(44,38,32,.06), 0 2px 8px rgba(44,38,32,.05);
  --sh-md:0 6px 18px rgba(44,38,32,.08), 0 2px 6px rgba(44,38,32,.05);
  --sh-lg:0 24px 60px -18px rgba(44,38,32,.28);

  /* layout */
  --maxw:1280px;
  --radius:16px;
  --radius-sm:10px;
  --nav-h:76px;
}

*{box-sizing:border-box;margin:0;padding:0;}
html{scroll-behavior:smooth;}
body{
  background:var(--paper);
  color:var(--ink);
  font-family:var(--font-sans);
  font-weight:300;
  font-size:17px;
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}
img{display:block;max-width:100%;}
a{color:inherit;text-decoration:none;}
button{font-family:inherit;cursor:pointer;border:none;background:none;color:inherit;}
input,textarea,select{font-family:inherit;font-size:inherit;color:inherit;}
::selection{background:var(--clay);color:#fff;}

/* ---------- typography ---------- */
.display{font-family:var(--font-display);font-weight:300;line-height:.96;letter-spacing:-.01em;}
.serif{font-family:var(--font-display);}
h1,h2,h3,h4{font-family:var(--font-display);font-weight:400;line-height:1.02;letter-spacing:-.005em;color:var(--ink);}
.eyebrow{
  font-family:var(--font-sans);font-weight:600;
  font-size:13px;letter-spacing:.28em;text-transform:uppercase;
  color:var(--terracotta);
}
.eyebrow.muted{color:var(--ink-faint);}
.eyebrow.light{color:rgba(255,255,255,.82);}
.lede{font-family:var(--font-display);font-style:italic;font-weight:400;color:var(--ink-soft);line-height:1.32;}
.muted{color:var(--ink-soft);}
.faint{color:var(--ink-faint);}

/* ---------- layout helpers ---------- */
.wrap{max-width:var(--maxw);margin:0 auto;padding:0 32px;}
.section{padding:92px 0;}
.section-sm{padding:60px 0;}
.center{text-align:center;}
.stack{display:flex;flex-direction:column;}
.row{display:flex;align-items:center;}
.grid{display:grid;}
.tile-strip{height:6px;width:100%;background:
  repeating-linear-gradient(135deg,var(--azulejo) 0 14px,#456178 14px 28px,var(--paper-2) 28px 30px);
  opacity:.9;}

/* ---------- buttons ---------- */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:10px;
  font-family:var(--font-sans);font-weight:500;font-size:15px;letter-spacing:.02em;
  padding:14px 26px;border-radius:999px;
  transition:transform .18s ease, background .2s ease, box-shadow .2s ease, color .2s ease;
  white-space:nowrap;line-height:1;
}
.btn svg{width:17px;height:17px;}
.btn-primary{background:var(--terracotta);color:#FBF3E7;box-shadow:var(--sh-sm);}
.btn-primary:hover{background:var(--terracotta-dk);transform:translateY(-2px);box-shadow:var(--sh-md);}
.btn-dark{background:var(--ink);color:var(--paper);}
.btn-dark:hover{background:#1c1814;transform:translateY(-2px);}
.btn-ghost{background:transparent;color:var(--ink);border:1px solid var(--line);}
.btn-ghost:hover{border-color:var(--ink);background:rgba(44,38,32,.04);}
.btn-azulejo{background:var(--azulejo);color:#fff;}
.btn-azulejo:hover{background:#26415e;transform:translateY(-2px);}
.btn-lg{padding:17px 34px;font-size:16px;}
.btn-sm{padding:10px 18px;font-size:13px;}
.btn-block{width:100%;}
.link-arrow{display:inline-flex;align-items:center;gap:8px;font-weight:500;font-size:15px;color:var(--terracotta);}
.link-arrow svg{width:16px;height:16px;transition:transform .2s ease;}
.link-arrow:hover svg{transform:translateX(4px);}

/* ---------- pills / badges ---------- */
.pill{
  display:inline-flex;align-items:center;gap:7px;
  font-family:var(--font-sans);font-weight:500;font-size:12.5px;letter-spacing:.04em;
  padding:7px 14px;border-radius:999px;background:var(--card);border:1px solid var(--line-soft);
  color:var(--ink-soft);
}
.badge{
  display:inline-flex;align-items:center;gap:6px;font-weight:600;font-size:11px;
  letter-spacing:.14em;text-transform:uppercase;padding:6px 11px;border-radius:6px;
}
.badge-sale{background:var(--terracotta);color:#fff;}
.badge-new{background:var(--azulejo);color:#fff;}
.badge-soft{background:var(--sand);color:var(--terracotta-dk);}

/* ---------- header / nav ---------- */
.site-header{
  position:sticky;top:0;z-index:60;
  background:rgba(245,238,226,.82);backdrop-filter:blur(14px);
  border-bottom:1px solid var(--line-soft);
}
.nav{height:var(--nav-h);display:flex;align-items:center;justify-content:space-between;gap:20px;}
.brand{display:flex;align-items:center;gap:12px;}
.brand-mark{
  width:38px;height:38px;border-radius:10px;flex:none;
  background:var(--terracotta);color:#fff;display:grid;place-items:center;
  font-family:var(--font-display);font-weight:600;font-size:22px;line-height:1;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.18);
}
.brand-mark svg{width:60%;height:60%;}
.brand-name{display:flex;flex-direction:column;line-height:1;}
.brand-name b{font-family:var(--font-display);font-weight:600;font-size:21px;letter-spacing:-.01em;white-space:nowrap;}
.brand-name span{font-size:10.5px;letter-spacing:.26em;text-transform:uppercase;color:var(--ink-faint);font-weight:500;margin-top:3px;}
.nav-links{display:flex;align-items:center;gap:30px;}
.nav-links a{font-size:15px;font-weight:400;color:var(--ink-soft);position:relative;padding:4px 0;transition:color .18s;white-space:nowrap;}
.nav-links a:hover,.nav-links a.active{color:var(--ink);}
.nav-links a.active::after{content:"";position:absolute;left:0;right:0;bottom:-2px;height:2px;background:var(--terracotta);border-radius:2px;}
.nav-actions{display:flex;align-items:center;gap:10px;}
.icon-btn{
  width:42px;height:42px;border-radius:50%;display:grid;place-items:center;
  color:var(--ink);transition:background .18s;position:relative;
}
.icon-btn:hover{background:rgba(44,38,32,.06);}
.icon-btn svg{width:21px;height:21px;}
.cart-count{
  position:absolute;top:4px;right:4px;min-width:18px;height:18px;padding:0 5px;
  background:var(--terracotta);color:#fff;border-radius:9px;
  font-size:11px;font-weight:600;display:grid;place-items:center;border:2px solid var(--paper);
}
.cart-count:empty,.cart-count[data-count="0"]{display:none;}
.nav-toggle{display:none;}

/* ---------- footer ---------- */
.site-footer{background:#241F1A;color:#CDBFAD;padding:72px 0 36px;}
.site-footer a{color:#CDBFAD;transition:color .18s;}
.site-footer a:hover{color:#fff;}
.footer-grid{display:grid;grid-template-columns:1.6fr 1fr 1fr 1fr;gap:40px;padding-bottom:48px;border-bottom:1px solid rgba(255,255,255,.1);}
.footer-grid h5{font-family:var(--font-sans);font-weight:600;font-size:12px;letter-spacing:.2em;text-transform:uppercase;color:#8C7E6C;margin-bottom:18px;}
.footer-grid ul{list-style:none;display:flex;flex-direction:column;gap:11px;font-size:14.5px;}
.footer-brand .brand-mark{background:var(--terracotta);}
.footer-brand p{font-size:15px;line-height:1.6;color:#A99B88;max-width:300px;margin-top:18px;}
.footer-bottom{display:flex;justify-content:space-between;align-items:center;padding-top:28px;font-size:13px;color:#8C7E6C;gap:20px;flex-wrap:wrap;}
.footer-bottom .legal{display:flex;gap:22px;flex-wrap:wrap;}

/* ---------- product card ---------- */
.product-card{
  background:var(--card-2);border:1px solid var(--line-soft);border-radius:var(--radius);
  overflow:hidden;display:flex;flex-direction:column;transition:transform .22s ease, box-shadow .22s ease;
  position:relative;
}
.product-card:hover{transform:translateY(-4px);box-shadow:var(--sh-lg);}
.product-card .pc-media{position:relative;aspect-ratio:4/3;background:var(--paper-2);overflow:hidden;}
.product-card .pc-media image-slot,.product-card .pc-media img{width:100%;height:100%;}
.product-card .pc-badges{position:absolute;top:14px;left:14px;display:flex;gap:8px;z-index:2;}
.product-card .pc-cat{position:absolute;bottom:14px;left:14px;z-index:2;}
.product-card .pc-body{padding:22px 22px 24px;display:flex;flex-direction:column;gap:10px;flex:1;}
.product-card .pc-title{font-family:var(--font-display);font-weight:500;font-size:25px;line-height:1.08;letter-spacing:-.01em;}
.product-card .pc-desc{font-size:14.5px;color:var(--ink-soft);line-height:1.5;flex:1;}
.product-card .pc-foot{display:flex;align-items:center;justify-content:space-between;margin-top:8px;gap:12px;}
.price{font-family:var(--font-display);font-weight:500;font-size:27px;color:var(--ink);line-height:1;}
.price .from{font-family:var(--font-sans);font-weight:400;font-size:12px;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-faint);display:block;margin-bottom:3px;}
.price s{color:var(--ink-faint);font-size:18px;font-weight:400;margin-left:7px;}

/* ---------- forms ---------- */
.field{display:flex;flex-direction:column;gap:7px;margin-bottom:18px;}
.field label{font-size:13px;font-weight:500;letter-spacing:.04em;color:var(--ink-soft);}
.input,select.input,textarea.input{
  width:100%;background:var(--card-2);border:1px solid var(--line);border-radius:var(--radius-sm);
  padding:13px 15px;font-size:15px;font-weight:300;color:var(--ink);transition:border .18s, box-shadow .18s;
}
.input:focus,textarea.input:focus,select.input:focus{outline:none;border-color:var(--terracotta);box-shadow:0 0 0 3px rgba(176,91,57,.14);}
.input::placeholder{color:var(--ink-faint);}
.field-row{display:grid;grid-template-columns:1fr 1fr;gap:16px;}

/* ---------- card / panel ---------- */
.panel{background:var(--card-2);border:1px solid var(--line-soft);border-radius:var(--radius);box-shadow:var(--sh-sm);}
.divider{height:1px;background:var(--line-soft);border:none;}

/* ---------- toast ---------- */
.toast-wrap{position:fixed;bottom:26px;left:50%;transform:translateX(-50%);z-index:200;display:flex;flex-direction:column;gap:10px;align-items:center;pointer-events:none;}
.toast{
  background:var(--ink);color:var(--paper);padding:14px 22px;border-radius:999px;
  font-size:14.5px;font-weight:400;box-shadow:var(--sh-lg);display:flex;align-items:center;gap:12px;
  animation:toastIn .3s cubic-bezier(.2,.8,.2,1) both;
}
.toast .tk{color:var(--clay);}
@keyframes toastIn{from{transform:translateY(16px);opacity:0;}to{transform:none;opacity:1;}}

/* ---------- azulejo motif ---------- */
.azulejo-band{
  background:var(--azulejo);color:#fff;position:relative;overflow:hidden;
}
.azulejo-band::before{
  content:"";position:absolute;inset:0;opacity:.10;
  background-image:
    radial-gradient(circle at 25% 25%, #fff 2px, transparent 2.5px),
    radial-gradient(circle at 75% 75%, #fff 2px, transparent 2.5px),
    linear-gradient(45deg, transparent 46%, #fff 46% 54%, transparent 54%),
    linear-gradient(-45deg, transparent 46%, #fff 46% 54%, transparent 54%);
  background-size:54px 54px;
}

/* ---------- reveal-on-scroll ---------- */
.reveal{opacity:0;transform:translateY(22px);transition:opacity .7s ease, transform .7s cubic-bezier(.2,.7,.2,1);}
.reveal.in{opacity:1;transform:none;}
@media (prefers-reduced-motion:reduce){.reveal{opacity:1;transform:none;transition:none;}}

/* ---------- utilities ---------- */
.tag-cat{font-size:12px;font-weight:500;letter-spacing:.1em;text-transform:uppercase;color:#fff;background:rgba(44,38,32,.55);backdrop-filter:blur(4px);padding:6px 11px;border-radius:6px;}
.star{color:var(--gold);}
.kbd-rule{display:flex;align-items:center;gap:18px;color:var(--ink-faint);font-size:13px;letter-spacing:.2em;text-transform:uppercase;font-weight:500;}
.kbd-rule::before,.kbd-rule::after{content:"";height:1px;background:var(--line);flex:1;}

/* ---------- responsive ---------- */
@media (max-width:1024px){
  :root{--maxw:100%;}
  .footer-grid{grid-template-columns:1fr 1fr;gap:32px;}
}
@media (max-width:860px){
  .nav-links{
    position:fixed;inset:var(--nav-h) 0 auto 0;background:var(--paper);
    flex-direction:column;align-items:flex-start;gap:0;padding:8px 0;
    border-bottom:1px solid var(--line);box-shadow:var(--sh-md);
    transform:translateY(-120%);transition:transform .28s ease;visibility:hidden;
  }
  .nav-links.open{transform:none;visibility:visible;}
  .nav-links a{width:100%;padding:15px 32px;font-size:17px;}
  .nav-links a.active::after{display:none;}
  .nav-toggle{display:grid;place-items:center;width:42px;height:42px;border-radius:50%;}
  .nav-toggle svg{width:24px;height:24px;}
  .section{padding:64px 0;}
  .wrap{padding:0 22px;}
  .field-row{grid-template-columns:1fr;}
}
@media (max-width:560px){
  body{font-size:16px;}
  .footer-grid{grid-template-columns:1fr;gap:28px;}
  .footer-bottom{flex-direction:column;align-items:flex-start;}
}