@import url('https://fonts.googleapis.com/css2?family=Cairo:wght@400;500;600;700;800&family=Playfair+Display:wght@600;700&display=swap');

:root {
  --cream: #f5ecdf;
  --paper: #fbf7f0;
  --sand: #e7d2b9;
  --brown: #35241d;
  --brown-soft: #65483a;
  --terracotta: #a95e45;
  --ink: #2d211d;
  --line: rgba(53, 36, 29, .16);
  --white: #fffaf3;
  --max: 1180px;
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; background: var(--cream); color: var(--ink); font-family: 'Cairo', 'Noto Sans Arabic', sans-serif; overflow-x: hidden; }
a { color: inherit; text-decoration: none; }
button, input, select { font: inherit; }
.announcement { display:flex; align-items:center; justify-content:center; gap: 14px; min-height: 34px; background: var(--brown); color: #f9ebdc; font-size: 11px; letter-spacing: .04em; }
.dot { width: 4px; height: 4px; border-radius: 50%; background: #d9a47a; }
.site-header { max-width: var(--max); margin: 0 auto; min-height: 88px; padding: 20px 30px; display:flex; align-items:center; justify-content:space-between; }
.brand, .footer-brand { display:flex; align-items:center; gap: 10px; }
.brand-mark { width: 38px; height: 38px; display:grid; place-items:center; border: 1px solid var(--brown); border-radius: 50%; color: var(--brown); font-family: 'Playfair Display', serif; font-size: 24px; font-weight: 700; }
.brand-copy { display:flex; flex-direction:column; line-height: 1; gap: 4px; }
.brand-copy strong { font-size: 20px; letter-spacing: .08em; }
.brand-copy small { color: var(--brown-soft); font-size: 9px; letter-spacing: .13em; }
.header-nav { display:flex; align-items:center; gap: 28px; }
.header-nav > a:first-child { color: var(--brown-soft); font-size: 11px; }
.header-link { font-size: 12px; font-weight: 700; border-bottom: 1px solid var(--brown); padding-bottom: 5px; }
.header-link span, .button span { margin-right: 8px; font-size: 16px; }
.section-shell { max-width: var(--max); margin-inline: auto; padding-inline: 30px; }
.hero { min-height: 690px; display:grid; grid-template-columns: 1fr .9fr; gap: 65px; align-items:center; padding-top: 55px; padding-bottom: 90px; }
.eyebrow { display:flex; align-items:center; gap: 11px; margin:0 0 25px; color: var(--terracotta); font-size: 11px; font-weight: 800; letter-spacing: .08em; }
.eyebrow-line { width: 30px; height: 1px; background: currentColor; display:inline-block; }
h1, h2, h3, p { margin-top: 0; }
h1, h2, blockquote { font-family: 'Playfair Display', 'Cairo', serif; font-weight: 700; }
h1 { font-size: clamp(51px, 7vw, 92px); line-height: .98; letter-spacing: -.04em; margin-bottom: 27px; }
h1 em, h2 em, blockquote em { color: var(--terracotta); font-style: normal; }
.hero-lead { max-width: 470px; color: var(--brown-soft); line-height: 2; font-size: 15px; margin-bottom: 34px; }
.hero-actions { display:flex; align-items:center; gap: 25px; flex-wrap: wrap; }
.button { border: none; cursor: pointer; display:inline-flex; align-items:center; justify-content:center; min-height: 54px; padding: 0 25px; border-radius: 2px; font-weight: 800; font-size: 13px; transition: transform .25s ease, box-shadow .25s ease, background .25s ease; }
.button:hover { transform: translateY(-3px); box-shadow: 0 14px 25px rgba(53, 36, 29, .16); }
.button-primary { background: var(--brown); color: var(--white); }
.text-link { font-size: 12px; font-weight: 700; color: var(--brown-soft); border-bottom: 1px solid var(--brown-soft); padding-bottom: 4px; }
.text-link span { margin-right: 6px; font-size: 17px; }
.trust-row { display:flex; gap: 24px; margin-top: 52px; color: var(--brown-soft); font-size: 11px; }
.trust-row div { display:flex; align-items:center; gap: 8px; }
.trust-icon { width: 22px; height: 22px; display:grid; place-items:center; border: 1px solid rgba(53,36,29,.3); border-radius: 50%; font-size: 10px; }
.hero-media-wrap { position:relative; max-width: 405px; margin-inline:auto; width: 100%; }
.media-glow { position:absolute; inset: 8% -18% -10%; background: #e7c9a8; filter: blur(1px); border-radius: 50% 48% 45% 53%; transform: rotate(-8deg); opacity: .8; }
.video-frame { position:relative; z-index:1; aspect-ratio: 9/15.7; overflow:hidden; border: 9px solid var(--paper); box-shadow: 0 24px 45px rgba(53,36,29,.2); background: #96725c; }
.product-video { width:100%; height:100%; display:block; object-fit: cover; }
.video-caption { position:absolute; right: 16px; bottom: 14px; display:flex; align-items:center; gap: 7px; color: #fff; font-size: 10px; text-shadow: 0 1px 3px #000; }
.play-dot { width: 7px; height: 7px; background: #e5aa70; border-radius:50%; box-shadow: 0 0 0 3px rgba(255,255,255,.3); }
.floating-note { position:absolute; z-index:2; display:flex; gap: 8px; align-items:center; background: var(--paper); padding: 11px 14px; box-shadow: 0 10px 25px rgba(53,36,29,.12); font-size: 11px; }
.floating-note span { color: var(--terracotta); font-family: 'Playfair Display', serif; font-size: 18px; }
.note-top { top: 14%; right: -54px; transform: rotate(4deg); }
.note-bottom { bottom: 13%; left: -57px; transform: rotate(-5deg); }
.marquee-band { overflow:hidden; background: var(--terracotta); color: #fcefe2; transform: rotate(-1.5deg) scale(1.02); margin: 7px 0 110px; }
.marquee-track { display:flex; align-items:center; justify-content:space-around; gap: 38px; width:max-content; min-width:100%; padding: 16px 0; font-family: 'Playfair Display', serif; font-size: 20px; white-space:nowrap; }
.marquee-track i { font-family: serif; font-style:normal; font-size: 13px; }
.story { display:grid; grid-template-columns: .72fr 1.28fr; gap: 75px; padding-bottom: 130px; }
.section-intro { padding-top: 20px; }
.section-intro h2, .order-copy h2 { font-size: clamp(42px, 5vw, 66px); line-height: 1.06; letter-spacing: -.04em; margin-bottom: 22px; }
.section-intro h2 span { color: var(--terracotta); }
.section-intro > p:last-child { color:var(--brown-soft); font-size: 14px; line-height: 2; max-width: 320px; }
.feature-stack { display:grid; grid-template-columns: repeat(3, 1fr); gap: 14px; align-items:start; }
.feature-card { min-height: 340px; padding: 22px; position:relative; display:flex; flex-direction:column; box-shadow: 0 15px 35px rgba(53,36,29,.07); }
.feature-card:nth-child(2) { margin-top: 48px; }
.feature-card:nth-child(3) { margin-top: 96px; }
.feature-dark { background: var(--brown); color: #fbeedd; }
.feature-light { background: #ead4b9; color: var(--brown); }
.feature-terracotta { background: var(--terracotta); color: #fff0e3; }
.feature-number { font-family: 'Playfair Display', serif; font-size: 14px; opacity:.7; }
.feature-icon { font-family: serif; font-size: 42px; margin: 42px 0 27px; }
.feature-card h3 { font-size: 17px; line-height: 1.45; margin-bottom: 11px; }
.feature-card p { font-size: 11px; line-height: 1.9; opacity: .78; }
.card-arrow { position:absolute; left: 20px; bottom: 20px; font-size: 18px; }
.quote-section { padding-bottom: 150px; text-align:center; }
.quote-mark { color: var(--terracotta); font-family: Georgia, serif; font-size: 85px; height: 75px; line-height:1; }
blockquote { font-size: clamp(42px, 6vw, 75px); line-height: 1.05; margin: 0 auto 22px; }
.quote-section > p { color: var(--brown-soft); font-size: 13px; }
.reviews-section { padding-bottom: 135px; }
.reviews-heading { display:flex; align-items:end; justify-content:space-between; gap: 35px; margin-bottom: 38px; }
.reviews-heading h2 { font-family: 'Playfair Display', 'Cairo', serif; font-size: clamp(42px, 5vw, 66px); line-height: 1.02; letter-spacing: -.04em; margin: 0; }
.reviews-heading h2 span { color: var(--terracotta); }
.reviews-heading .eyebrow { margin-bottom: 18px; }
.reviews-intro { color: var(--brown-soft); font-size: 13px; line-height: 2; max-width: 235px; margin-bottom: 7px; }
.reviews-grid { display:grid; grid-template-columns: 1.18fr 1fr 1fr; gap: 14px; align-items: stretch; }
.review-card { min-height: 310px; padding: 27px 25px 23px; background: var(--paper); border: 1px solid rgba(53,36,29,.1); display:flex; flex-direction:column; justify-content:space-between; box-shadow: 0 15px 30px rgba(53,36,29,.05); }
.review-card:nth-child(2) { margin-top: 28px; background: #ead4b9; }
.review-card:nth-child(3) { margin-top: 56px; background: #e8c1ad; }
.review-featured { background: var(--brown); color: var(--white); }
.review-top { display:flex; align-items:center; justify-content:space-between; }
.stars { color: #d9956e; font-size: 13px; letter-spacing: 2px; }
.review-index { font-family: 'Playfair Display', serif; font-size: 14px; opacity: .55; }
.review-card blockquote { font-family: 'Cairo', sans-serif; font-size: 16px; font-weight: 600; line-height: 1.9; margin: 36px 0; }
.review-author { display:flex; align-items:center; gap: 10px; }
.avatar { width: 33px; height: 33px; display:grid; place-items:center; border-radius: 50%; background:#d9956e; color:var(--brown); font-weight:800; }
.avatar-sand { background: #fff2df; }
.avatar-rose { background: #a95e45; color: #fff3e8; }
.review-author span:last-child { display:flex; flex-direction:column; gap: 2px; }
.review-author strong { font-size: 11px; }
.review-author small { font-size: 9px; opacity: .65; }
.order-section { padding-bottom: 95px; }
.order-panel { background: var(--brown); color: var(--white); display:grid; grid-template-columns: 1fr .9fr; gap: 50px; padding: 65px 72px; position:relative; overflow:hidden; }
.order-panel::before { content:''; position:absolute; width: 360px; height:360px; border: 1px solid rgba(248,228,204,.2); border-radius:50%; left: -150px; bottom: -190px; box-shadow: 0 0 0 30px rgba(248,228,204,.04), 0 0 0 60px rgba(248,228,204,.025); }
.light-eyebrow { color:#d99a72; }
.order-copy { position:relative; z-index:1; }
.order-copy h2 { color: var(--white); margin-bottom: 20px; }
.order-copy p:not(.eyebrow) { color: #d9c4b3; font-size: 13px; line-height:2; max-width: 390px; }
.whatsapp-badge { display:inline-flex; align-items:center; gap: 9px; color:#e4ad87; font-size: 11px; margin-top: 20px; }
.whatsapp-badge span:first-child { width: 25px; height: 25px; border: 1px solid #e4ad87; display:grid; place-items:center; border-radius:50%; }
.order-form { position:relative; z-index:1; background: rgba(255,250,243,.08); padding: 27px; border: 1px solid rgba(255,250,243,.18); }
.order-form label { display:block; color:#e7d4c3; font-size: 11px; margin-bottom: 13px; }
.order-form input, .order-form select { display:block; width:100%; margin-top: 6px; height: 45px; border: 1px solid rgba(255,250,243,.22); background: rgba(255,250,243,.1); color:#fffaf3; padding: 0 13px; outline:none; border-radius: 0; }
.order-form input::placeholder { color:#cdb8a7; }
.order-form input:focus, .order-form select:focus { border-color:#dda57e; box-shadow: 0 0 0 3px rgba(221,165,126,.12); }
.order-form select option { color: var(--brown); }
.button-whatsapp { background: #d9956e; color: var(--brown); width:100%; margin-top: 10px; }
.form-note { color: #cdb8a7; font-size: 9px; text-align:center; margin: 13px 0 0; }
.site-footer { min-height: 100px; border-top: 1px solid var(--line); display:flex; align-items:center; justify-content:space-between; gap: 20px; color: var(--brown-soft); font-size: 11px; }
.footer-brand strong { font-family:'Playfair Display',serif; font-size: 20px; }
.footer-brand .brand-mark { width: 31px; height:31px; font-size: 19px; }
.footer-note { opacity:.75; }
@media (max-width: 850px) {
  .hero { grid-template-columns: 1fr; gap: 48px; padding-top: 28px; }
  .hero-copy { text-align:center; }
  .eyebrow { justify-content:center; }
  .hero-lead { margin-inline:auto; }
  .hero-actions, .trust-row { justify-content:center; }
  .hero-media-wrap { max-width: 365px; }
  .story { grid-template-columns:1fr; gap: 38px; }
  .section-intro { text-align:center; }
  .section-intro > p:last-child { margin-inline:auto; }
  .section-intro .eyebrow { justify-content:center; }
  .reviews-heading { align-items:start; flex-direction:column; gap: 10px; }
  .reviews-heading > div { width:100%; text-align:center; }
  .reviews-heading .eyebrow { justify-content:center; }
  .reviews-intro { margin: 0 auto; text-align:center; }
  .reviews-grid { grid-template-columns:1fr 1fr; }
  .review-card:nth-child(3) { grid-column: 1 / -1; margin-top: 0; min-height: 245px; }
  .order-panel { grid-template-columns:1fr; padding: 45px 28px; }
  .order-copy { text-align:center; }
  .order-copy .eyebrow { justify-content:center; }
  .order-copy p:not(.eyebrow) { margin-inline:auto; }
}
@media (max-width: 560px) {
  .site-header { min-height: 75px; padding: 16px 20px; }
  .header-nav { gap: 14px; }
  .header-nav > a:first-child { display:none; }
  .section-shell { padding-inline: 20px; }
  .hero { padding-bottom: 65px; }
  h1 { font-size: 55px; }
  .note-top { right: -8px; }
  .note-bottom { left: -8px; }
  .feature-stack { grid-template-columns:1fr; }
  .feature-card, .feature-card:nth-child(2), .feature-card:nth-child(3) { margin-top:0; min-height: 240px; }
  .feature-icon { margin: 22px 0 14px; }
  .quote-section { padding-bottom: 90px; }
  .reviews-section { padding-bottom: 90px; }
  .reviews-grid { grid-template-columns:1fr; }
  .review-card, .review-card:nth-child(2), .review-card:nth-child(3) { margin-top:0; min-height: 250px; }
  .order-section { padding-inline: 12px; }
  .order-panel { padding: 42px 20px; }
  .site-footer { flex-wrap:wrap; padding-block: 25px; }
  .footer-note { width:100%; }
}