/* Orlina Jewels - base: colour tokens, reset, buttons, shared section styles */
:root{
  --wine-900:#110003;   /* header */
  --wine-800:#40010f;   /* top bar / footer */
  --wine-700:#4a0110;   /* offer bar / banner */
  --wine-600:#5a0718;   /* hero base */
  --wine-500:#6e0a22;
  --maroon-text:#5a0718;
  --cream:#fcf0e0;      /* page paper */
  --cream-2:#fceddd;
  --gold-100:#fedc8d;
  --gold-200:#faebcb;
  --gold-400:#eaad50;
  --gold-500:#d99a3d;
  --gold-700:#b2742c;
  --text-light:#f7e3c4;
  --radius:16px;
  --serif:"Playfair Display","Cormorant Garamond",Georgia,serif;
  --body:"Cormorant Garamond",Georgia,serif;
  --ui:"Jost","Segoe UI",Arial,sans-serif;
}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font-family:var(--body);font-size:17px;color:var(--maroon-text);background:var(--cream);line-height:1.5;-webkit-font-smoothing:antialiased}
img{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
ul{list-style:none;margin:0;padding:0}
h1,h2,h3,p{margin:0}
.container{width:min(1200px,100% - 32px);margin-inline:auto}
.ico{width:1.25em;height:1.25em;flex:none}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
:focus-visible{outline:2px solid var(--gold-100);outline-offset:3px}
.btn{display:inline-flex;align-items:center;gap:.6em;padding:.7em 1.7em;border-radius:999px;font-family:var(--serif);font-weight:600;font-size:1rem;cursor:pointer;transition:filter .2s,transform .2s}
.btn--gold{color:#3a0610;background:linear-gradient(180deg,var(--gold-100),var(--gold-400));box-shadow:0 4px 14px rgba(0,0,0,.3)}
.btn--gold:hover{filter:brightness(1.06);transform:translateY(-1px)}
.btn .ico{width:1.1em;height:1.1em}
.paper{background:linear-gradient(180deg,var(--cream-2),var(--cream) 30%,#fbefdc);padding-bottom:8px}
.section{padding-block:38px 10px}
.section__title{display:flex;align-items:center;justify-content:center;gap:22px;font-family:var(--serif);font-weight:600;color:var(--maroon-text);font-size:clamp(1.6rem,3vw,2.2rem);margin-bottom:26px;text-align:center}
.section__title::before,.section__title::after{content:"";height:2px;width:clamp(30px,10vw,130px);background:linear-gradient(90deg,transparent,var(--gold-500))}
.section__title::after{transform:scaleX(-1)}
.banner{position:relative;display:flex;align-items:center;justify-content:space-between;overflow:hidden;border-radius:10px;margin-top:22px;background:linear-gradient(90deg,var(--wine-800),var(--wine-600) 55%,var(--wine-800));box-shadow:0 8px 20px rgba(64,1,15,.35)}
.banner__text{position:relative;z-index:2;padding:30px 0 30px 54px;flex:0 0 42%}
.banner h2{font-family:var(--serif);font-weight:600;font-size:clamp(2rem,4vw,3rem);line-height:1.1;background:linear-gradient(180deg,#f6d58b,#c8893a);-webkit-background-clip:text;background-clip:text;color:transparent;margin-bottom:6px}
.banner p{color:var(--gold-200);font-size:1.25rem;margin-bottom:16px}
.banner img{position:absolute;right:0;top:0;height:100%;width:62%;object-fit:cover;object-position:left center;
  -webkit-mask-image:linear-gradient(90deg,transparent 0,#000 25%);mask-image:linear-gradient(90deg,transparent 0,#000 25%)}
.banner{min-height:158px}
@media (max-width:680px){
  body{font-size:16px}
  .banner{flex-direction:column;align-items:stretch}
  .banner__text{flex:none;padding:26px 22px 8px;text-align:center}
  .banner img{position:relative;width:100%;height:170px;-webkit-mask-image:none;mask-image:none;object-position:center}
}
@media (max-width:520px){
  .section__title::before,.section__title::after{width:22px}
}

/* Scroll reveal (only when JS is on, so no-JS visitors still see everything) */
.js .reveal:not(.is-in){opacity:0}
.reveal.is-in{animation:reveal .8s cubic-bezier(.2,.7,.2,1) backwards;animation-delay:calc(var(--i,0) * 90ms)}
@keyframes reveal{from{opacity:0;transform:translateY(26px) scale(.97)}}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation:none !important;transition:none !important;scroll-behavior:auto !important}
}
