:root {
  --lavender: #f5eff7;
  --light-blue: #eaf4f3;
  --icon-lavender: #f3edf5;
  --deep-teal: #00555d;
  --purple: #b89ec5;
  --purple-deep: #00555d;
  --purple-pale: #f1e9f3;
  --orange: #ffb496;
  --ink: #363636;
  --plum-ink: #2d1b3d;
  --muted: #787878;
  --paper: #fafafa;
  --white: #fff;
  --line: rgba(54, 54, 54, .1);
  --shadow: 0 24px 70px rgba(64, 47, 79, .1);
  --radius-xl: 34px;
  --radius-lg: 24px;
  --radius-md: 16px;
  font-family: 'IBM Plex Sans Arabic', 'Inter', sans-serif;
  color: var(--ink);
  background: var(--paper);
  font-synthesis: none;
  text-rendering: optimizeLegibility;
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; min-width: 320px; background: var(--paper); color: var(--ink); }
body, button, input, select, textarea { font-family: 'IBM Plex Sans Arabic', 'Inter', sans-serif; }
a { color: inherit; text-decoration: none; }
button, input, select, textarea { font: inherit; }
button { cursor: pointer; }
img, svg { max-width: 100%; }
.shell { width: min(1160px, calc(100% - 44px)); margin-inline: auto; }
.site-header { position: sticky; top: 0; z-index: 20; background: rgba(250,250,250,.9); backdrop-filter: blur(16px); border-bottom: 1px solid rgba(54,54,54,.06); }
.nav { min-height: 84px; display: flex; align-items: center; justify-content: space-between; gap: 24px; }
.brand { display: inline-flex; align-items: center; gap: 8px; flex: 0 0 auto; }
.brand img { width: 132px; height: auto; aspect-ratio: 1109 / 463; object-fit: contain; }
.language-toggle { border: 1px solid rgba(0,85,93,.22); background: #fff; color: var(--deep-teal); border-radius: 999px; min-width: 42px; height: 38px; padding: 0 11px; font: 600 12px Inter,sans-serif; }
.brand-copy { display: grid; line-height: 1.05; text-align: right; }
.brand-latin { font: 600 17px/1 Inter, sans-serif; letter-spacing: .3em; color: var(--purple); direction: ltr; }
.brand-ar { color: var(--purple); font-size: 12px; letter-spacing: .08em; margin-top: 4px; }
.nav-links { display: flex; align-items: center; gap: clamp(14px, 2.6vw, 34px); color: #5b5660; font-size: 14px; }
.nav-links a { transition: color .2s ease; }
.nav-links a:hover, .nav-links a.active { color: var(--purple-deep); }
.nav-actions { display: flex; align-items: center; gap: 10px; }
.menu-toggle { display: none; width: 44px; height: 44px; border: 1px solid var(--line); border-radius: 50%; background: var(--white); color: var(--plum-ink); }
.button { border: 0; display: inline-flex; align-items: center; justify-content: center; gap: 9px; min-height: 48px; padding: 0 21px; border-radius: 999px; font-weight: 600; font-size: 14px; transition: transform .2s ease, box-shadow .2s ease, background .2s ease; }
.button:hover { transform: translateY(-2px); box-shadow: 0 10px 22px rgba(91,63,115,.16); }
.button-primary { color: var(--white); background: var(--purple-deep); }
.button-soft { color: var(--plum-ink); background: var(--white); border: 1px solid rgba(91,63,115,.12); }
.button-ghost { color: var(--purple-deep); background: transparent; border: 1px solid rgba(91,63,115,.25); }
.button-dark { color: var(--white); background: var(--deep-teal); }
.button-small { min-height: 42px; padding-inline: 17px; font-size: 13px; }
.hero { overflow: hidden; position: relative; padding: 62px 0 44px; }
.hero:before { content: ''; position: absolute; width: 560px; height: 560px; border-radius: 50%; background: radial-gradient(circle, rgba(215,214,255,.78), rgba(215,214,255,0) 68%); inset: -230px auto auto -110px; pointer-events: none; }
.hero-grid { display: grid; grid-template-columns: 1.05fr .95fr; align-items: center; gap: clamp(35px, 7vw, 95px); position: relative; }
.eyebrow { display: inline-flex; align-items: center; gap: 9px; font-size: 13px; color: var(--purple-deep); background: var(--purple-pale); padding: 8px 14px; border-radius: 999px; }
.eyebrow-dot { width: 8px; height: 8px; background: var(--orange); border-radius: 50%; box-shadow: 0 0 0 5px rgba(255,180,150,.2); }
h1, h2, h3, p { margin-top: 0; }
.hero h1 { color: var(--plum-ink); font-size: clamp(40px, 5.2vw, 65px); line-height: 1.25; letter-spacing: -.035em; margin: 22px 0 18px; max-width: 660px; }
.hero h1 em { font-style: normal; color: var(--purple-deep); position: relative; }
.hero-copy { max-width: 540px; color: #66616c; font-size: 17px; line-height: 1.95; margin-bottom: 25px; }
.hero-actions { display: flex; flex-wrap: wrap; gap: 12px; align-items: center; }
.rating { display: flex; align-items: center; gap: 10px; margin-top: 31px; color: var(--muted); font-size: 13px; }
.stars { color: #f08a5d; letter-spacing: 2px; font-size: 17px; direction: ltr; }
.rating strong { color: var(--ink); font: 600 15px Inter, sans-serif; }
.hero-art { min-height: 470px; position: relative; display: grid; place-items: center; }
.art-blob { position: absolute; inset: 28px 8% 20px; background: linear-gradient(140deg, var(--lavender), #eee8f5 58%, #fff2ed); border-radius: 49% 51% 42% 58% / 46% 40% 60% 54%; transform: rotate(-7deg); }
.art-sun { position: absolute; width: 78px; height: 78px; border-radius: 50%; background: var(--orange); opacity: .86; top: 28px; right: 52px; box-shadow: 0 0 0 16px rgba(255,180,150,.2); }
.art-leaf { position: absolute; width: 120px; height: 56px; border-radius: 100% 0 100% 0; background: rgba(0,85,93,.85); transform: rotate(-34deg); bottom: 70px; right: 7px; }
.art-leaf.two { width: 100px; height: 48px; right: auto; left: 32px; bottom: 130px; background: #77a9a2; transform: rotate(38deg) scaleX(-1); }
.gift-box { position: absolute; width: 195px; height: 177px; background: linear-gradient(145deg, #fff, #f8eff8); border-radius: 18px; box-shadow: 0 24px 55px rgba(68,46,89,.17); bottom: 76px; left: 13%; transform: rotate(-9deg); }
.gift-box:before { content: ''; position: absolute; height: 100%; width: 30px; left: calc(50% - 15px); background: linear-gradient(90deg, #b89ec5, #d8c8e0); }
.gift-box:after { content: ''; position: absolute; height: 28px; width: 100%; top: calc(50% - 14px); background: linear-gradient(0deg, #b89ec5, #d8c8e0); }
.gift-bow { position: absolute; z-index: 1; width: 86px; height: 46px; border: 12px solid #9f7fae; border-radius: 55% 45% 50% 50%; top: -27px; left: calc(50% - 43px); }
.bouquet { position: absolute; top: 78px; left: 50%; width: 245px; height: 245px; transform: translateX(-40%); z-index: 2; }
.flower { position: absolute; width: 82px; height: 82px; border-radius: 50%; background: radial-gradient(circle at 50% 50%, #e2a764 0 10%, transparent 11%), radial-gradient(ellipse at 50% 10%, #fff 0 22%, transparent 23%), radial-gradient(ellipse at 90% 50%, #f8d7e2 0 22%, transparent 23%), radial-gradient(ellipse at 50% 90%, #fdf1f3 0 22%, transparent 23%), radial-gradient(ellipse at 10% 50%, #f8d7e2 0 22%, transparent 23%); filter: drop-shadow(0 8px 10px rgba(90,65,82,.12)); }
.flower:nth-child(1) { top: 42px; left: 75px; transform: scale(1.1); }
.flower:nth-child(2) { top: 12px; left: 135px; transform: scale(.78); }
.flower:nth-child(3) { top: 102px; left: 28px; transform: scale(.86); }
.flower:nth-child(4) { top: 120px; left: 116px; transform: scale(1.1); }
.flower:nth-child(5) { top: 76px; left: 166px; transform: scale(.76); }
.flower:nth-child(6) { top: 0; left: 54px; transform: scale(.66); }
.float-card { position: absolute; z-index: 4; background: rgba(255,255,255,.93); border: 1px solid rgba(255,255,255,.8); box-shadow: var(--shadow); border-radius: 18px; padding: 14px 17px; display: flex; align-items: center; gap: 12px; backdrop-filter: blur(12px); }
.float-card small { display: block; color: var(--muted); font-size: 11px; }
.float-card strong { color: var(--plum-ink); font-size: 13px; }
.float-icon { display: grid; place-items: center; width: 38px; height: 38px; border-radius: 13px; background: var(--icon-lavender); color: var(--purple-deep); font-size: 18px; }
.float-icon svg { width: 20px; height: 20px; }
.float-card.one { top: 97px; left: 2px; }
.float-card.two { bottom: 28px; right: 10px; }
.section { padding: 75px 0; }
.section-head { max-width: 680px; margin: 0 auto 34px; text-align: center; }
.section-kicker { color: var(--purple-deep); font-size: 13px; font-weight: 600; margin-bottom: 10px; }
.section-head h2, .page-intro h1 { color: var(--plum-ink); font-size: clamp(30px, 4vw, 45px); line-height: 1.35; margin-bottom: 13px; letter-spacing: -.025em; }
.section-head p, .page-intro p { color: var(--muted); font-size: 16px; line-height: 1.9; margin-bottom: 0; }
.category-grid { display: grid; grid-template-columns: repeat(6, 1fr); gap: 14px; }
.category-card { background: var(--white); border: 1px solid rgba(54,54,54,.06); border-radius: 22px; padding: 18px 12px; text-align: center; transition: transform .2s ease, box-shadow .2s ease; }
.category-card:hover { transform: translateY(-5px); box-shadow: var(--shadow); }
.category-visual { width: 82px; height: 82px; border-radius: 25px; margin: 0 auto 13px; display: grid; place-items: center; font-size: 35px; background: var(--visual-bg, var(--purple-pale)); }
.category-visual svg { width: 42px; height: 42px; color: var(--purple-deep); }
.category-card strong { font-size: 14px; color: var(--plum-ink); }
.features { background: linear-gradient(180deg, rgba(237,237,255,.56), rgba(250,250,250,0)); }
.feature-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; }
.feature-card { background: var(--white); border: 1px solid rgba(54,54,54,.06); border-radius: var(--radius-lg); padding: 28px; min-height: 217px; }
.feature-icon { width: 52px; height: 52px; display: grid; place-items: center; border-radius: 17px; background: var(--icon-lavender); color: var(--purple-deep); font-size: 23px; margin-bottom: 20px; }
.feature-icon svg { width: 27px; height: 27px; }
.feature-card h3 { color: var(--plum-ink); font-size: 19px; margin-bottom: 9px; }
.feature-card p { color: var(--muted); line-height: 1.85; font-size: 14px; margin: 0; }
.partners-band { display: grid; grid-template-columns: .95fr 1.05fr; align-items: center; gap: 50px; border-radius: var(--radius-xl); background: var(--deep-teal); color: var(--white); padding: clamp(30px,5vw,60px); position: relative; overflow: hidden; }
.partners-band:after { content: ''; width: 320px; height: 320px; border-radius: 50%; border: 1px solid rgba(255,255,255,.15); position: absolute; right: -85px; bottom: -185px; box-shadow: 0 0 0 35px rgba(255,255,255,.03), 0 0 0 70px rgba(255,255,255,.03); }
.partners-band h2 { font-size: clamp(30px,4vw,43px); line-height: 1.35; margin: 0 0 14px; }
.partners-band p { color: rgba(255,255,255,.76); line-height: 1.9; margin: 0; }
.partners-band .button { background: var(--white); color: var(--deep-teal); margin-top: 23px; }
.partner-pills { display: grid; grid-template-columns: repeat(2, 1fr); gap: 13px; position: relative; z-index: 1; }
.partner-pill { display: flex; align-items: center; gap: 12px; min-height: 78px; padding: 15px; background: rgba(255,255,255,.1); border: 1px solid rgba(255,255,255,.14); border-radius: 17px; color: rgba(255,255,255,.94); font-size: 14px; }
.partner-pill span { display: grid; place-items: center; width: 39px; height: 39px; background: rgba(255,255,255,.15); border-radius: 13px; font-size: 18px; }
.partner-pill span svg { width: 23px; height: 23px; color: var(--white); }
.faq-list { max-width: 780px; margin: auto; display: grid; gap: 11px; }
.faq-item { background: var(--white); border: 1px solid rgba(54,54,54,.07); border-radius: 18px; overflow: hidden; }
.faq-question { width: 100%; border: 0; background: transparent; color: var(--plum-ink); display: flex; align-items: center; justify-content: space-between; gap: 20px; text-align: right; padding: 19px 22px; font-weight: 600; font-size: 15px; }
.faq-plus { flex: 0 0 auto; color: var(--purple-deep); font-size: 22px; transition: transform .2s ease; }
.faq-answer { color: var(--muted); line-height: 1.9; font-size: 14px; padding: 0 22px 20px; display: none; }
.faq-item.open .faq-answer { display: block; }
.faq-item.open .faq-plus { transform: rotate(45deg); }
.prefooter { padding: 20px 0 78px; }
.prefooter-card { position: relative; overflow: hidden; padding: clamp(30px,5vw,55px); border-radius: var(--radius-xl); background: var(--lavender); display: flex; align-items: center; justify-content: space-between; gap: 25px; }
.prefooter-card:after { content: '♡'; position: absolute; color: rgba(91,63,115,.11); font: 200px/1 Inter,sans-serif; left: 20%; bottom: -75px; transform: rotate(-15deg); }
.prefooter-card h2 { color: var(--plum-ink); font-size: clamp(28px,3.5vw,40px); margin: 0 0 7px; }
.prefooter-card p { color: #655a70; margin: 0; }
.prefooter-card .button { flex: 0 0 auto; position: relative; z-index: 1; }
.site-footer { background: #2d1b3d; color: var(--white); padding: 50px 0 24px; }
.footer-grid { display: grid; grid-template-columns: 1.4fr 1fr 1fr 1fr; gap: 40px; padding-bottom: 38px; }
.footer-brand .brand-latin, .footer-brand .brand-ar { color: var(--white); }
.footer-brand p { max-width: 280px; color: rgba(255,255,255,.65); font-size: 13px; line-height: 1.8; margin: 17px 0; }
.footer-title { font-weight: 600; margin-bottom: 15px; font-size: 14px; }
.footer-list { display: grid; gap: 11px; color: rgba(255,255,255,.68); font-size: 13px; }
.footer-list a:hover { color: var(--white); }
.socials { display: flex; gap: 10px; }
.social-link { display: grid; place-items: center; width: 40px; height: 40px; border: 1px solid rgba(255,255,255,.2); border-radius: 50%; font: 16px Inter,sans-serif; transition: background .2s ease, color .2s ease, transform .2s ease; }
.social-link:hover { background: var(--lavender); color: var(--deep-teal); transform: translateY(-2px); }
.social-link svg, .whatsapp-float svg { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.social-link[title="LinkedIn"] svg { fill: currentColor; stroke: none; }
.whatsapp-float { position: fixed; z-index: 50; right: max(22px, env(safe-area-inset-right)); bottom: max(22px, env(safe-area-inset-bottom)); width: 58px; height: 58px; display: grid; place-items: center; border-radius: 50%; background: #1fae63; color: white; box-shadow: 0 8px 24px rgba(0,0,0,.22); transition: transform .2s ease, box-shadow .2s ease; }
.whatsapp-float:hover { transform: translateY(-3px); box-shadow: 0 11px 28px rgba(0,0,0,.28); }
.whatsapp-float svg { width: 29px; height: 29px; stroke-width: 1.7; }
.laura-widget { position: fixed; z-index: 51; left: max(22px, env(safe-area-inset-left)); bottom: max(22px, env(safe-area-inset-bottom)); direction: rtl; font-family: 'IBM Plex Sans Arabic', Inter, sans-serif; }
.laura-launcher { position: relative; display: block; padding: 0; width: 68px; height: 68px; border: 3px solid white; border-radius: 50%; overflow: hidden; background: #eee5f4; box-shadow: 0 8px 24px rgba(36,22,46,.25); cursor: pointer; }
.laura-launcher img { display: block; width: 100%; height: 100%; object-fit: cover; object-position: center 46%; }
.laura-online { position: absolute; right: 3px; bottom: 4px; width: 13px; height: 13px; border: 2px solid white; border-radius: 50%; background: #26a269; }
.laura-panel { position: absolute; bottom: 82px; left: 0; width: min(360px, calc(100vw - 36px)); height: min(500px, calc(100dvh - 130px)); min-height: 380px; overflow: hidden; display: flex; flex-direction: column; background: white; border: 1px solid #e7dfea; border-radius: 20px; box-shadow: 0 16px 50px rgba(32,18,42,.22); }
.laura-panel[hidden] { display: none; }
.laura-head { display: flex; align-items: center; gap: 11px; padding: 13px 15px; color: white; background: linear-gradient(115deg, var(--deep-teal), #087078); }
.laura-head img { width: 43px; height: 43px; object-fit: cover; object-position: center 46%; border-radius: 50%; border: 2px solid rgba(255,255,255,.8); background: #eee5f4; }
.laura-head div { flex: 1; display: grid; gap: 2px; }
.laura-head small { color: rgba(255,255,255,.75); font-size: 12px; }
.laura-head button { padding: 0 6px; color: white; border: 0; background: transparent; font-size: 26px; cursor: pointer; }
.laura-messages { flex: 1; overflow-y: auto; display: flex; flex-direction: column; align-items: flex-start; gap: 10px; padding: 15px; background: #fbf9fc; }
.laura-message { max-width: 88%; padding: 10px 12px; border-radius: 14px 14px 14px 4px; background: white; border: 1px solid #eee7f0; color: #362d3a; font-size: 13px; line-height: 1.7; }
.laura-message.user { align-self: flex-end; color: white; background: var(--deep-teal); border-color: var(--deep-teal); border-radius: 14px 14px 4px 14px; }
.laura-message a { display: inline-block; margin-top: 4px; color: var(--deep-teal); font-weight: 700; }
.laura-quick-questions { display: flex; flex-wrap: wrap; gap: 7px; }
.laura-quick-questions button { padding: 7px 10px; border: 1px solid #d8c7de; border-radius: 999px; color: #5c4267; background: white; font: inherit; font-size: 12px; cursor: pointer; }
.laura-form { display: flex; gap: 8px; padding: 10px 12px; border-top: 1px solid #eee7f0; }
.laura-form input { min-width: 0; flex: 1; padding: 10px 12px; border: 1px solid #e4dce7; border-radius: 999px; outline-color: var(--lavender); font: inherit; font-size: 13px; }
.laura-form button { width: 39px; height: 39px; border: 0; border-radius: 50%; background: var(--deep-teal); color: white; cursor: pointer; }
.laura-note { padding: 0 14px 10px; text-align: center; color: #827987; background: white; font-size: 10px; }
@media (max-width: 520px) {
  .laura-widget { left: 14px; bottom: max(16px, env(safe-area-inset-bottom)); }
  .laura-launcher { width: 60px; height: 60px; }
  .laura-panel { left: 0; bottom: 73px; width: calc(100vw - 28px); height: min(480px, calc(100dvh - 112px)); }
  .whatsapp-float { right: max(14px, env(safe-area-inset-right)); bottom: max(16px, env(safe-area-inset-bottom)); width: 54px; height: 54px; }
}

/* Editorial polish: Lovard palette, photographic category panels, and restrained motion. */
:root { --brand-lavender: #B89EC5; --brand-teal: #00555D; }
body { font-kerning: normal; }
h1, h2, h3, .nav-links, .button { font-family: 'IBM Plex Sans Arabic', Inter, sans-serif; }
.section-head h2, .page-intro h1, .hero-copy-card h1 { font-weight: 600; letter-spacing: -.018em; }
.section-head p, .hero-copy-card .hero-copy, .page-intro p { line-height: 1.9; }
.site-header { border-bottom-color: rgba(0,85,93,.09); }
.nav-links a { position: relative; padding-block: 8px; }
.nav-links a:after { position: absolute; content: ''; height: 1px; width: 0; bottom: 2px; inset-inline-start: 0; background: var(--brand-teal); transition: width .22s ease; }
.nav-links a:hover:after, .nav-links a.active:after { width: 100%; }
.hero-carousel { background: linear-gradient(135deg, #f7f3f8 0%, #f0e8f3 58%, #eaf3f1 100%); }
.hero-copy-card { border-radius: 22px; }
.hero-copy-card h1 { font-size: clamp(39px, 4.45vw, 60px); line-height: 1.32; }
.hero-visual { border-radius: 22px; box-shadow: 0 22px 58px rgba(39,32,46,.12); }
.hero-illustration { transition: opacity .34s ease, transform .6s cubic-bezier(.2,.7,.2,1); }
.hero-carousel.is-changing .hero-illustration { opacity: .76; transform: scale(1.025); }
.hero-float-card { border-radius: 16px; }
.button-primary { background: var(--brand-teal); }
.section-head { margin-bottom: 42px; }
.section-head h2 { line-height: 1.38; }
.style-section { background: linear-gradient(180deg, #f8f5f9 0%, #f2edf4 100%); }
.style-grid { gap: 20px; }
.style-card { min-height: 330px; border: 0; border-radius: 22px; padding: 24px; isolation: isolate; background-color: #5d5260; box-shadow: 0 12px 34px rgba(36,27,43,.12); }
.style-card:after { position: absolute; content: ''; z-index: 1; inset: 0; background: linear-gradient(180deg, rgba(25,20,28,.02) 15%, rgba(25,20,28,.12) 44%, rgba(25,20,28,.76) 100%); transition: opacity .3s ease; }
.style-card:hover { transform: translateY(-6px); box-shadow: 0 20px 40px rgba(36,27,43,.2); }
.style-card:hover:after { opacity: .88; }
.style-card-photo { position: absolute; z-index: 0; inset: 0; width: 100%; height: 100%; object-fit: cover; transition: transform .65s cubic-bezier(.2,.7,.2,1); }
.style-card:hover .style-card-photo { transform: scale(1.055); }
.style-card > div:last-child { margin-top: auto; }
.style-card small, .style-card h3, .style-card .style-cta { color: white; }
.style-card h3 { font-size: 24px; }
.style-card .style-cta { display: inline-flex; align-items: center; gap: 7px; opacity: .9; }
.style-art { z-index: 2; top: 20px; left: 20px; color: rgba(255,255,255,.9); filter: drop-shadow(0 3px 10px rgba(0,0,0,.18)); }
.style-art svg { width: 72px; height: 72px; }
.partners-band { border-radius: 24px; background: linear-gradient(125deg, #123e42, #00555d 62%, #176b6d); box-shadow: 0 22px 55px rgba(0,60,65,.18); }
.partner-showcase-card { border-radius: 18px; }
.faq-item { border-radius: 14px; }
.scroll-reveal { opacity: 1; transform: none; }
.motion-ready .scroll-reveal:not(.is-visible) { opacity: 0; transform: translateY(18px); }
.motion-ready .scroll-reveal { transition: opacity .55s ease, transform .55s cubic-bezier(.2,.7,.2,1); }
.hero-copy-card { animation: hero-card-in .48s cubic-bezier(.2,.7,.2,1) both; }
.hero-visual { animation: hero-photo-in .64s cubic-bezier(.2,.7,.2,1) both; }
@keyframes hero-card-in { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }
@keyframes hero-photo-in { from { opacity: 0; transform: scale(.975); } to { opacity: 1; transform: scale(1); } }
@media (max-width: 720px) {
  .style-card { min-height: 270px; }
  .section-head { margin-bottom: 28px; }
  .hero-copy-card h1 { font-size: clamp(32px, 8.5vw, 45px); }
}
@media (prefers-reduced-motion: reduce) {
  .hero-copy-card, .hero-visual { animation: none; }
  .motion-ready .scroll-reveal, .style-card-photo, .hero-illustration { transition: none !important; }
}
.announcement { background: #f3edf5; color: var(--brand-teal); border-bottom: 1px solid rgba(0,85,93,.07); font-size: 12px; }
.announcement-inner { min-height: 40px; justify-content: center; gap: 10px; padding-block: 6px; }
.announcement-message { line-height: 1.6; text-align: center; font-weight: 500; }
.announcement-spark { color: var(--brand-lavender); font-size: 14px; line-height: 1; }
@media (max-width: 600px) {
  .announcement-inner { min-height: 42px; gap: 7px; padding-block: 7px; }
  .announcement-message { font-size: 11px; }
}
/* Soft finishing pass for the Lovard brand */
:root { --paper: #fcf9fb; --plum-ink: #194347; --muted: #77727a; --shadow: 0 18px 48px rgba(0,65,70,.09); }
body { background: var(--paper); -webkit-font-smoothing: antialiased; }
.site-header { background: rgba(252,249,251,.93); box-shadow: 0 4px 18px rgba(40,30,45,.025); }
.nav { min-height: 76px; }
.brand img { width: 138px; }
.nav-links { font-weight: 500; }
.language-toggle { border-color: rgba(0,85,93,.17); background: rgba(255,255,255,.78); }
.button { letter-spacing: .005em; }
.hero-carousel { background: linear-gradient(135deg, #faf6fa 0%, #f2ebf5 52%, #eff5f3 100%); }
.hero-grid { gap: 14px 34px; }
.hero-copy-card { border-color: rgba(184,158,197,.2); background: rgba(255,255,255,.91); box-shadow: 0 20px 58px rgba(36,62,64,.085); }
.hero-copy-card h1 { color: #18464a; }
.hero-copy-card .hero-copy { color: #68666b; }
.hero-visual { background: #eee7f0; box-shadow: 0 22px 58px rgba(36,62,64,.12); }
.hero-float-card { border-color: rgba(255,255,255,.95); box-shadow: 0 12px 34px rgba(23,63,67,.12); }
.section { padding-block: 82px; }
.section-head { max-width: 740px; }
.section-kicker { display: inline-flex; align-items: center; padding: 5px 11px; border-radius: 999px; background: #f0e8f3; color: var(--brand-teal); font-size: 12px; }
.section-head h2, .page-intro h1 { color: #194347; }
.features { background: linear-gradient(180deg, rgba(243,237,245,.78), rgba(252,249,251,0)); }
.feature-card { border-color: rgba(184,158,197,.14); border-radius: 21px; box-shadow: 0 7px 24px rgba(30,46,48,.035); transition: transform .28s ease, box-shadow .28s ease, border-color .28s ease; }
.feature-card:hover { transform: translateY(-5px); border-color: rgba(0,85,93,.16); box-shadow: 0 18px 38px rgba(0,65,70,.09); }
.feature-icon { background: linear-gradient(145deg,#f4edf6,#eaf3f1); border-radius: 16px; }
.faq-item { border-color: rgba(184,158,197,.18); border-radius: 16px; transition: box-shadow .22s ease, border-color .22s ease; }
.faq-item:hover, .faq-item.open { border-color: rgba(0,85,93,.2); box-shadow: 0 8px 26px rgba(0,65,70,.055); }
.faq-question { padding-block: 21px; }
.site-footer { background: linear-gradient(140deg,#194347,#102f33); }
@media (max-width: 720px) {
  .section { padding-block: 57px; }
  .nav { min-height: 68px; }
  .brand img { width: 120px; }
  .hero-grid { gap: 12px 18px; }
  .feature-card { padding: 23px; }
}
.story-section { background: linear-gradient(180deg, #fcf9fb 0%, #f5f0f6 100%); }
.story-grid { display: grid; grid-template-columns: 1fr 1fr; align-items: center; gap: clamp(34px, 7vw, 88px); }
.story-copy h2 { margin: 15px 0 14px; color: #194347; font-size: clamp(31px, 4vw, 48px); font-weight: 600; line-height: 1.35; letter-spacing: -.02em; }
.story-copy > p { max-width: 540px; color: #6d6870; font-size: 15px; line-height: 1.95; }
.story-points { display: grid; gap: 14px; margin: 25px 0 27px; }
.story-points > div { display: flex; align-items: center; gap: 12px; }
.story-points > div > span { width: 42px; height: 42px; display: grid; place-items: center; border-radius: 14px; color: var(--brand-teal); background: linear-gradient(145deg,#f0e8f3,#eaf3f1); }
.story-points svg { width: 21px; height: 21px; }
.story-points strong, .story-points small { display: block; }
.story-points strong { color: #24484b; font-size: 13px; }
.story-points small { margin-top: 3px; color: #817b83; font-size: 11px; }
.story-copy > .button { border-color: rgba(0,85,93,.2); color: var(--brand-teal); }
.story-visual { min-height: 465px; position: relative; overflow: hidden; border-radius: 28px; background: #e6dce9; box-shadow: 0 24px 60px rgba(29,61,64,.13); }
.story-visual:after { position: absolute; content: ''; inset: 38% 0 0; background: linear-gradient(180deg,transparent,rgba(25,39,41,.45)); pointer-events: none; }
.story-visual > img { display: block; width: 100%; height: 100%; min-height: 465px; position: absolute; inset: 0; object-fit: cover; transition: transform .8s cubic-bezier(.2,.7,.2,1); }
.story-visual:hover > img { transform: scale(1.035); }
.story-image-note { position: absolute; z-index: 2; inset-inline-start: 20px; bottom: 20px; display: grid; gap: 5px; padding: 15px 18px; border: 1px solid rgba(255,255,255,.6); border-radius: 16px; color: white; background: rgba(255,255,255,.15); backdrop-filter: blur(14px); }
.story-image-note small { color: rgba(255,255,255,.8); font-size: 11px; }
.story-image-note strong { font-size: 17px; font-weight: 600; }
.story-mark { position: absolute; z-index: 2; top: 20px; left: 20px; padding: 8px 11px; border: 1px solid rgba(255,255,255,.65); border-radius: 999px; color: white; background: rgba(38,49,49,.18); backdrop-filter: blur(9px); font: 500 9px Inter,sans-serif; letter-spacing: .14em; }
@media (max-width: 760px) {
  .story-grid { grid-template-columns: 1fr; gap: 25px; }
  .story-copy { order: 1; }
  .story-visual { min-height: 360px; order: 2; border-radius: 22px; }
  .story-visual > img { min-height: 360px; }
}
.footer-bottom { border-top: 1px solid rgba(255,255,255,.12); display: flex; justify-content: space-between; gap: 12px; padding-top: 18px; color: rgba(255,255,255,.55); font-size: 12px; }
.page-hero { padding: 58px 0 34px; background: linear-gradient(180deg, rgba(215,214,255,.55), transparent); }
.page-intro { max-width: 800px; margin-inline: auto; text-align: center; }
.page-intro h1 { margin: 15px 0 12px; }
.page-shell { max-width: 880px; margin: 0 auto; }
.content-card { background: var(--white); border: 1px solid rgba(54,54,54,.07); border-radius: var(--radius-xl); padding: clamp(24px,4vw,44px); box-shadow: 0 14px 48px rgba(64,47,79,.045); }
.content-card h2 { color: var(--plum-ink); font-size: 23px; margin: 0 0 10px; }
.content-card p { color: var(--muted); line-height: 1.95; }
.vision-grid, .value-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 15px; margin-top: 24px; }
.vision-card, .value-card { background: #fbf9fc; border: 1px solid rgba(184,158,197,.19); border-radius: 20px; padding: 22px; }
.vision-card h3, .value-card h3 { color: var(--purple-deep); font-size: 17px; margin: 0 0 8px; }
.vision-card p, .value-card p { font-size: 14px; margin: 0; }
.form-intro { margin-bottom: 25px; }
.form-grid { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 17px; }
.field { display: grid; gap: 8px; }
.field.full { grid-column: 1 / -1; }
.field label { font-size: 13px; color: #514b58; font-weight: 600; }
.field input, .field select, .field textarea { width: 100%; min-height: 49px; border: 1px solid #e7e2eb; border-radius: 13px; background: #fff; color: var(--ink); padding: 12px 14px; outline: 0; transition: border-color .2s, box-shadow .2s; }
.field textarea { min-height: 125px; resize: vertical; }
.field input:focus, .field select:focus, .field textarea:focus { border-color: var(--purple); box-shadow: 0 0 0 3px rgba(184,158,197,.15); }
.field input[type=file] { padding: 10px; color: var(--muted); font-size: 12px; }
.field small { color: var(--muted); font-size: 11px; }
.check-row { display: flex; align-items: flex-start; gap: 10px; color: #625c68; font-size: 13px; line-height: 1.8; margin-top: 18px; }
.check-row input { margin-top: 5px; accent-color: var(--purple-deep); }
.form-actions { display: flex; align-items: center; gap: 14px; margin-top: 23px; flex-wrap: wrap; }
.form-note { color: var(--muted); font-size: 12px; line-height: 1.7; }
.form-status { margin-top: 16px; padding: 13px 15px; border-radius: 13px; display: none; color: var(--deep-teal); background: #e8f6f2; font-size: 13px; }
.form-status.show { display: block; }
.download-panel { display: grid; grid-template-columns: 1fr .8fr; align-items: center; gap: 26px; }
.phone-mock { min-height: 350px; background: linear-gradient(145deg, var(--lavender), var(--purple-pale)); border-radius: 28px; display: grid; place-items: center; overflow: hidden; position: relative; }
.phone-frame { width: 190px; height: 320px; border: 8px solid #312b39; border-radius: 34px; background: var(--white); box-shadow: 0 22px 45px rgba(48,35,56,.2); padding: 18px 13px; transform: rotate(-7deg); }
.phone-top { width: 55px; height: 5px; background: #312b39; border-radius: 99px; margin: -8px auto 22px; }
.phone-logo { width: 42px; height: 42px; margin: 0 auto 11px; }
.phone-photo { height: 100px; border-radius: 15px; background: linear-gradient(135deg, #f5d8e5, #e9e3ff 50%, #d9eee5); display: grid; place-items: center; font-size: 34px; }
.phone-line { height: 7px; border-radius: 99px; background: #eee8f2; margin-top: 12px; }
.phone-line.short { width: 54%; }
.phone-products { display: grid; grid-template-columns: repeat(2,1fr); gap: 8px; margin-top: 15px; }
.phone-products span { height: 60px; border-radius: 11px; background: #fbf0f4; display: grid; place-items: center; }
.app-buttons { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 24px; }
.store-button { display: inline-flex; align-items: center; gap: 10px; background: #241c2d; color: var(--white); border-radius: 13px; padding: 11px 16px; min-width: 145px; }
.store-button small { display: block; font: 10px Inter,sans-serif; opacity: .68; direction: ltr; text-align: left; }
.store-button strong { display: block; font: 600 13px Inter,sans-serif; direction: ltr; text-align: left; }
.terms-box { max-height: 230px; overflow: auto; border: 1px solid #e9e1ed; border-radius: 16px; padding: 18px; margin: 22px 0; background: #fdfbfd; color: #615968; font-size: 13px; line-height: 1.9; }
.success-card { max-width: 650px; text-align: center; margin: auto; }
.success-mark { width: 72px; height: 72px; border-radius: 50%; display: grid; place-items: center; background: #e5f4ec; color: #2b8768; font-size: 32px; margin: 0 auto 18px; }
.not-found { text-align: center; padding: 40px 0; }
.not-found-code { color: var(--purple); font: 700 clamp(70px,12vw,130px)/1 Inter,sans-serif; letter-spacing: -.08em; }
.empty-image { min-height: 180px; border-radius: 22px; background: linear-gradient(140deg,#f8e7ef,#e9e4ff 55%,#e4f2ed); display: grid; place-items: center; font-size: 54px; margin-bottom: 20px; }
.mobile-bottom { display: none; }
.muted { color: var(--muted); }

@media (max-width: 900px) {
  .nav-links { gap: 15px; font-size: 13px; }
  .nav-actions .button { padding-inline: 16px; }
  .hero-grid { gap: 24px; }
  .hero-art { min-height: 400px; }
  .category-grid { grid-template-columns: repeat(3,1fr); }
  .footer-grid { grid-template-columns: repeat(2,1fr); }
}
@media (max-width: 680px) {
  .shell { width: min(100% - 32px, 520px); }
  .nav { min-height: 70px; }
  .brand img { width: 108px; height: auto; }
  .brand-latin { font-size: 14px; }
  .menu-toggle { display: grid; place-items: center; }
  .nav-links { position: absolute; display: none; top: 69px; right: 16px; left: 16px; padding: 13px; background: var(--white); border: 1px solid var(--line); box-shadow: var(--shadow); border-radius: 20px; align-items: stretch; flex-direction: column; gap: 0; }
  .nav-links.open { display: flex; }
  .nav-links a { padding: 12px 14px; border-radius: 12px; }
  .nav-links a:hover { background: #f7f2fa; }
  .nav-actions .button { min-height: 42px; font-size: 12px; padding-inline: 13px; }
  .hero { padding: 38px 0 30px; }
  .hero-grid { grid-template-columns: 1fr; gap: 16px; }
  .hero-copy { font-size: 15px; }
  .hero h1 { font-size: clamp(36px, 10vw, 51px); }
  .hero-art { min-height: 350px; max-width: 500px; width: 100%; margin-inline: auto; }
  .art-blob { inset: 22px 7% 15px; }
  .bouquet { transform: translateX(-39%) scale(.84); top: 47px; }
  .gift-box { transform: rotate(-9deg) scale(.82); left: 8%; bottom: 46px; }
  .float-card.one { top: 62px; left: -1px; }
  .float-card.two { bottom: 5px; right: 0; }
  .section { padding: 54px 0; }
  .section-head { margin-bottom: 25px; }
  .section-head p, .page-intro p { font-size: 14px; }
  .category-grid { grid-template-columns: repeat(2,1fr); gap: 10px; }
  .category-card { padding: 14px 8px; border-radius: 18px; }
  .category-visual { width: 70px; height: 70px; border-radius: 21px; font-size: 30px; }
  .feature-grid { grid-template-columns: 1fr; gap: 12px; }
  .feature-card { min-height: auto; padding: 22px; }
  .feature-icon { margin-bottom: 14px; }
  .partners-band { grid-template-columns: 1fr; gap: 25px; border-radius: 25px; padding: 28px 23px; }
  .partners-band p { font-size: 14px; }
  .partner-pills { gap: 9px; }
  .partner-pill { padding: 11px; min-height: 68px; font-size: 12px; }
  .partner-pill span { width: 33px; height: 33px; }
  .prefooter { padding-bottom: 55px; }
  .prefooter-card { align-items: flex-start; flex-direction: column; border-radius: 25px; }
  .footer-grid { grid-template-columns: 1fr 1fr; gap: 29px 18px; }
  .footer-brand { grid-column: 1/-1; }
  .footer-bottom { flex-direction: column; text-align: center; }
  .page-hero { padding: 40px 0 20px; }
  .content-card { border-radius: 24px; }
  .vision-grid, .value-grid { grid-template-columns: 1fr; }
  .form-grid { grid-template-columns: 1fr; gap: 14px; }
  .field.full { grid-column: auto; }
  .download-panel { grid-template-columns: 1fr; }
  .phone-mock { order: 2; min-height: 320px; }
  .app-buttons { width: 100%; }
  .store-button { flex: 1 1 130px; }
  .mobile-bottom { display: flex; position: fixed; bottom: 12px; right: 16px; left: 16px; z-index: 25; justify-content: center; pointer-events: none; }
  .mobile-bottom .button { pointer-events: auto; box-shadow: 0 12px 30px rgba(45,27,61,.22); }
  .site-footer { padding-bottom: 86px; }
}
.page-partners .mobile-bottom, .page-complaints .mobile-bottom, .page-delivery .mobile-bottom, .page-hr .mobile-bottom, .page-contract .mobile-bottom { display: none; }
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { scroll-behavior: auto !important; transition-duration: .01ms !important; animation-duration: .01ms !important; } }

/* Lovard storefront layout, adapted to the brand palette and content. */
.announcement { background: var(--plum-ink); color: rgba(255,255,255,.86); font-size: 11px; }
.announcement-inner { min-height: 31px; display: flex; align-items: center; justify-content: space-between; gap: 20px; }
.site-header { background: rgba(250,249,247,.96); }
.nav { min-height: 78px; }
.nav-links { gap: clamp(13px,2vw,26px); font-size: 13px; color: #49434d; }
.nav-actions { display: flex; align-items: center; gap: 8px; }
.icon-button { width: 40px; height: 40px; border: 1px solid rgba(45,27,61,.11); color: var(--plum-ink); border-radius: 50%; background: rgba(255,255,255,.68); display: grid; place-items: center; }
.icon-button:hover { background: var(--purple-pale); color: var(--purple-deep); }
.icon-button svg { width: 18px; height: 18px; }
.search-popover { position: absolute; top: calc(100% - 5px); left: max(22px, calc((100vw - 1160px) / 2)); z-index: 25; width: min(360px, calc(100vw - 32px)); padding: 16px; border: 1px solid var(--line); border-radius: 16px; background: var(--white); box-shadow: var(--shadow); }
.search-popover label { display: block; margin-bottom: 8px; color: var(--plum-ink); font-size: 13px; font-weight: 600; }
.search-popover div { display: flex; gap: 8px; }
.search-popover input { flex: 1; min-width: 0; border: 1px solid #e7e2eb; border-radius: 11px; padding: 9px 12px; outline: none; }
.search-popover input:focus { border-color: var(--purple); }
.hero-carousel { position: relative; overflow: hidden; background: #f4eef6; padding: 30px 0 0; }
.hero-carousel:before { content: ''; position: absolute; width: 590px; height: 590px; border: 1px solid rgba(91,63,115,.08); border-radius: 50%; top: -390px; left: -180px; box-shadow: 0 0 0 35px rgba(91,63,115,.025), 0 0 0 72px rgba(91,63,115,.02); }
.hero-grid { display: grid; position: relative; grid-template-columns: 1fr 1fr; grid-template-rows: minmax(480px,auto) 35px; align-items: center; gap: 8px 28px; padding-bottom: 7px; }
.hero-copy-card { grid-column: 1; grid-row: 1; position: relative; z-index: 2; width: min(100%, 520px); min-height: 420px; padding: clamp(27px,4vw,48px); border: 1px solid rgba(91,63,115,.14); border-radius: 13px; background: rgba(255,255,255,.82); box-shadow: 0 18px 55px rgba(45,27,61,.1); backdrop-filter: blur(8px); transition: opacity .22s, transform .22s; }
.hero-carousel.is-changing .hero-copy-card { opacity: .68; transform: translateY(5px); }
.hero-eyebrow { display: inline-flex; align-items: center; gap: 10px; padding: 8px 12px; border-radius: 999px; background: #f1e8f4; color: var(--purple-deep); font-size: 12px; }
.hero-copy-card h1 { color: var(--plum-ink); font-size: clamp(38px,4.3vw,57px); line-height: 1.3; letter-spacing: -.025em; margin: 22px 0 14px; }
.hero-copy-card .hero-copy { max-width: 430px; font-size: 15px; line-height: 1.9; margin-bottom: 22px; }
.hero-copy-card .hero-actions { gap: 10px; }
.button-outline { border: 1px solid rgba(91,63,115,.37); color: var(--purple-deep); background: transparent; }
.hero-note { display: flex; align-items: center; gap: 10px; color: #756a7b; margin-top: 19px; font-size: 12px; }
.hero-note-icon { display: grid; place-items: center; width: 28px; height: 28px; border-radius: 50%; color: var(--purple-deep); background: var(--purple-pale); }
.hero-note-icon svg { width: 15px; height: 15px; }
.hero-visual { grid-column: 2; grid-row: 1; position: relative; min-height: 450px; display: grid; place-items: center; transition: opacity .35s, transform .55s; }
.hero-carousel.is-changing .hero-visual { opacity: .8; transform: scale(.985); }
.hero-illustration { position: relative; z-index: 1; display: block; width: min(100%,590px); max-height: 485px; object-fit: contain; filter: drop-shadow(0 18px 20px rgba(45,27,61,.07)); }
.hero-float-card { position: absolute; z-index: 2; display: flex; align-items: center; gap: 10px; padding: 12px 15px; border: 1px solid rgba(255,255,255,.8); border-radius: 13px; background: rgba(255,255,255,.92); box-shadow: 0 12px 30px rgba(45,27,61,.1); }
.hero-float-card small { display: block; color: var(--muted); font-size: 10px; }
.hero-float-card strong { color: var(--plum-ink); font-size: 12px; }
.hero-float-card .float-icon { width: 34px; height: 34px; }
.float-top { top: 60px; left: 2%; }
.float-bottom { right: 0; bottom: 42px; }
.carousel-arrow { position: absolute; top: 50%; z-index: 5; width: 42px; height: 42px; display: grid; place-items: center; border-radius: 50%; border: 1px solid rgba(91,63,115,.1); color: var(--purple-deep); background: rgba(255,255,255,.65); }
.carousel-arrow:hover { background: var(--white); box-shadow: 0 8px 20px rgba(45,27,61,.1); }
.carousel-arrow svg { width: 17px; height: 17px; }
.carousel-prev { right: 4px; }
.carousel-next { left: 4px; }
.carousel-next svg { transform: rotate(180deg); }
.carousel-dots { grid-column: 1 / -1; grid-row: 2; display: flex; justify-content: center; align-items: center; gap: 11px; }
.carousel-dot { width: 8px; height: 8px; border: 0; border-radius: 999px; padding: 0; background: rgba(91,63,115,.28); transition: width .25s, background .25s; }
.carousel-dot.active { width: 24px; background: var(--purple-deep); }
.hero-delivery { padding: 12px 16px; text-align: center; color: #766c7b; background: rgba(255,255,255,.67); font-size: 12px; }
.hero-delivery > span:first-child { color: #e5a36f; }
.delivery-separator { color: var(--purple); padding-inline: 5px; }
.trust-strip { background: #fff; border-block: 1px solid rgba(54,54,54,.07); }
.trust-items { display: flex; align-items: center; justify-content: center; gap: clamp(16px,4vw,45px); min-height: 75px; }
.trust-items div { display: flex; align-items: center; gap: 8px; color: var(--purple-deep); }
.trust-items small { color: var(--muted); font-size: 11px; }
.trust-items strong { font: 600 14px Inter,sans-serif; color: var(--plum-ink); }
.trust-items i { width: 1px; height: 24px; background: var(--line); }
.trust-items svg { width: 18px; height: 18px; }
.trust-star { color: #e9a15e; font-size: 18px; }
.shop-by-occasion { padding-top: 68px; }
.occasion-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 18px; }
.occasion-card { min-width: 0; background: #fff; border: 1px solid rgba(54,54,54,.07); border-radius: 15px; overflow: hidden; box-shadow: 0 9px 28px rgba(45,27,61,.04); transition: transform .25s, box-shadow .25s; }
.occasion-card:hover { transform: translateY(-5px); box-shadow: 0 20px 38px rgba(45,27,61,.11); }
.occasion-card[hidden] { display: none; }
.occasion-image { position: relative; min-height: 220px; display: grid; place-items: center; overflow: hidden; background: var(--visual-bg); }
.occasion-image:before { content: ''; position: absolute; width: 185px; height: 185px; border-radius: 50%; border: 1px solid rgba(91,63,115,.12); box-shadow: 0 0 0 22px rgba(255,255,255,.28), 0 0 0 48px rgba(255,255,255,.19); transition: transform .5s; }
.occasion-card:hover .occasion-image:before { transform: scale(1.12); }
.occasion-image svg { position: relative; z-index: 1; width: 94px; height: 94px; color: var(--purple-deep); stroke-width: 1.35; transition: transform .45s; }
.occasion-card:hover .occasion-image svg { transform: scale(1.12) rotate(-5deg); }
.occasion-orbit { position: absolute; width: 10px; height: 10px; border-radius: 50%; background: var(--orange); top: 22%; left: 27%; box-shadow: 120px 105px 0 var(--purple), -50px 120px 0 rgba(255,255,255,.8); }
.occasion-link { position: absolute; left: 14px; top: 14px; width: 33px; height: 33px; display: grid; place-items: center; border-radius: 50%; color: var(--purple-deep); background: rgba(255,255,255,.8); }
.occasion-copy { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 18px; }
.occasion-copy h3 { color: var(--plum-ink); font-size: 17px; margin: 0 0 5px; }
.occasion-copy p { color: var(--muted); font-size: 12px; margin: 0; line-height: 1.65; }
.occasion-arrow { color: var(--purple-deep); font-size: 20px; transition: transform .2s; }
.occasion-card:hover .occasion-arrow { transform: translateX(-4px); }
.center-action { display: flex; justify-content: center; margin-top: 27px; }
.style-section { background: #f7f4f8; }
.style-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 16px; }
.style-card { min-height: 230px; padding: 23px; border-radius: 16px; display: flex; flex-direction: column; justify-content: space-between; overflow: hidden; position: relative; border: 1px solid rgba(45,27,61,.07); transition: transform .25s, box-shadow .25s; }
.style-card:hover { transform: translateY(-4px); box-shadow: var(--shadow); }
.style-flowers { background: #f5e8ee; }
.style-gifts { background: #eee8f5; }
.style-sweets { background: #e7f0ed; }
.style-card > div:last-child { position: relative; z-index: 2; }
.style-card small { color: #756b7b; font-size: 11px; }
.style-card h3 { color: var(--plum-ink); font-size: 22px; margin: 5px 0 11px; }
.style-cta { color: var(--purple-deep); font-weight: 600; font-size: 12px; }
.style-art { position: absolute; top: 12px; left: 18px; color: rgba(91,63,115,.36); }
.style-art svg { width: 94px; height: 94px; stroke-width: 1.1; }
.style-art span { position: absolute; top: 15px; right: -10px; color: #fff; font-size: 29px; }
.partner-section { padding-top: 30px; }
.partners-band { grid-template-columns: 1fr 1fr; background: var(--plum-ink); }
.partner-showcase { display: grid; grid-template-columns: repeat(3,1fr); align-items: center; gap: 10px; position: relative; z-index: 1; }
.partner-showcase-card { min-height: 160px; padding: 15px 9px; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 8px; text-align: center; border-radius: 14px; border: 1px solid rgba(255,255,255,.18); background: rgba(255,255,255,.07); color: #fff; transform: translateY(6px); transition: transform .3s, background .3s; }
.partner-showcase-card:nth-child(2) { transform: translateY(-9px); background: rgba(255,255,255,.13); }
.partner-showcase-card:hover { transform: translateY(-12px); background: rgba(255,255,255,.16); }
.partner-showcase-card span svg { width: 33px; height: 33px; color: #e4cfe9; }
.partner-showcase-card strong { font-size: 14px; }
.partner-showcase-card small { color: rgba(255,255,255,.68); font-size: 10px; }
.app-banner { min-height: 300px; border-radius: var(--radius-xl); background: #ece6f4; display: grid; grid-template-columns: 1fr .8fr; align-items: center; padding: clamp(24px,5vw,52px); overflow: hidden; }
.app-banner h2 { color: var(--plum-ink); font-size: clamp(29px,3vw,40px); margin: 8px 0; }
.app-banner p { color: var(--muted); }
.app-banner img { width: min(100%,370px); justify-self: center; margin: -35px 0; }

/* Editorial storefront polish and Flower-Palace-inspired shopping interactions. */
:root { --paper:#fbf9f6; --ink:#17363a; --plum-ink:#123b3e; --shadow:0 18px 50px rgba(0,55,58,.09); --radius-xl:22px; }
.announcement { background:#00555d; letter-spacing:.01em; }
.site-header { background:rgba(255,255,255,.96); }
.nav { min-height:82px; }
.hero-carousel { background:#f4eff2; padding-top:24px; }
.hero-copy-card { border-radius:18px; background:rgba(255,255,255,.93); border:1px solid rgba(0,85,93,.12); box-shadow:0 18px 55px rgba(0,50,54,.1); }
.hero-eyebrow { background:#f4edf6; color:#00555d; }
.hero-visual { overflow:hidden; border-radius:18px; background:#eee4ea; }
.hero-illustration { height:100%; min-height:450px; max-height:500px; width:100%; object-fit:cover; object-position:69% 52%; filter:none; }
.hero-float-card { border-radius:15px; }
.carousel-dot.active { background:#00555d; }
.product-section { padding-block:54px 64px; }
.product-head { display:flex; align-items:end; justify-content:space-between; gap:18px; margin-bottom:25px; }
.product-head .section-head { margin:0; text-align:right; }
.product-head .section-head h2 { margin-bottom:8px; }
.product-head > .button { margin-bottom:4px; flex:none; }
.product-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:17px; }
.product-card { min-width:0; border-radius:16px; overflow:hidden; background:#fff; border:1px solid rgba(0,85,93,.1); transition:transform .28s ease,box-shadow .28s ease; }
.product-card:hover { transform:translateY(-5px); box-shadow:0 18px 38px rgba(0,55,58,.12); }
.product-image-wrap { position:relative; aspect-ratio:1/.91; overflow:hidden; background:#f5eff2; }
.product-image { width:100%; height:100%; object-fit:cover; transition:transform .6s cubic-bezier(.2,.7,.2,1); }
.product-card:hover .product-image { transform:scale(1.055); }
.product-badge { position:absolute; inset-block-start:13px; inset-inline-start:13px; padding:7px 10px; border-radius:99px; background:rgba(255,255,255,.93); color:#00555d; font-size:10px; font-weight:600; }
.favorite-button { position:absolute; inset-block-start:11px; inset-inline-end:11px; width:36px; height:36px; border:0; border-radius:50%; background:rgba(255,255,255,.94); color:#00555d; font-size:22px; line-height:1; transition:transform .2s,background .2s,color .2s; }
.favorite-button:hover { transform:scale(1.08); }
.favorite-button.is-favorite { color:#a84e69; background:#fff0f3; }
.product-info { padding:14px 15px 15px; }
.product-info > small { color:#876e8d; font-size:11px; }
.product-info h3 { margin:5px 0 6px; color:#123b3e; font-size:16px; }
.product-info p { min-height:36px; color:#767873; font-size:11px; line-height:1.7; margin:0 0 13px; }
.product-buy { display:flex; justify-content:space-between; align-items:center; gap:8px; padding-top:11px; border-top:1px solid #efefea; }
.product-buy > strong { white-space:nowrap; font:600 16px Inter,sans-serif; color:#123b3e; }
.product-buy > strong small { font:500 10px 'IBM Plex Sans Arabic',sans-serif; }
.add-button { border:0; background:#00555d; color:#fff; border-radius:99px; min-height:37px; padding:0 13px; font-size:11px; display:flex; align-items:center; gap:8px; transition:background .2s,transform .2s; }
.add-button:hover { background:#003f45; transform:translateY(-1px); }
.add-button span { font-size:17px; line-height:1; }
.demo-caption { margin:15px 0 0; color:#85857f; font-size:10px; text-align:center; }
.gift-builder { background:#f4eff2; padding-block:58px; }
.builder-layout { display:grid; grid-template-columns:.9fr 1.1fr; min-height:500px; border-radius:22px; overflow:hidden; background:#fff; box-shadow:0 18px 55px rgba(0,55,58,.08); }
.builder-photo { position:relative; min-height:480px; overflow:hidden; background:#ddd0df; }
.builder-photo > img { width:100%; height:100%; position:absolute; inset:0; object-fit:cover; transition:opacity .25s; }
.builder-stamp { position:absolute; top:22px; left:22px; background:#fff; color:#00555d; border-radius:99px; padding:8px 12px; font:600 10px Inter,sans-serif; letter-spacing:.12em; text-transform:uppercase; }
.builder-summary { position:absolute; inset-inline:18px; bottom:18px; display:grid; gap:4px; padding:15px 17px; border-radius:14px; color:#fff; background:linear-gradient(90deg,rgba(0,48,52,.74),rgba(0,48,52,.16)); backdrop-filter:blur(8px); }
.builder-summary small { font-size:11px; color:rgba(255,255,255,.78); }
.builder-summary strong { font-size:17px; }
.builder-panel { padding:clamp(27px,4vw,48px); }
.builder-panel h2 { color:#123b3e; font-size:clamp(27px,3vw,38px); line-height:1.35; margin:8px 0 10px; }
.builder-panel > p { color:#74766f; font-size:13px; line-height:1.8; margin-bottom:23px; }
.builder-step { padding-block:14px; border-top:1px solid #eeece7; }
.builder-step > strong { display:block; color:#24464a; font-size:12px; margin-bottom:10px; }
.choice-row { display:flex; flex-wrap:wrap; gap:7px; }
.choice { border:1px solid #e5e2de; border-radius:99px; background:#fff; color:#5c6561; padding:8px 12px; font-size:11px; transition:all .18s; }
.choice:hover,.choice.selected { color:#00555d; background:#edf5f3; border-color:#78aaa6; }
.builder-actions { display:flex; align-items:center; flex-wrap:wrap; gap:12px; margin-top:18px; }
.builder-actions > span { font-size:10px; color:#898983; }
.cart-toggle { position:relative; }
.cart-toggle > span { position:absolute; top:-4px; right:-4px; min-width:17px; height:17px; border-radius:50%; background:#b89ec5; color:white; display:grid; place-items:center; font:600 9px Inter,sans-serif; }
.cart-drawer { position:fixed; z-index:50; inset-block:0; inset-inline-end:0; width:min(390px,92vw); padding:20px; background:#fff; box-shadow:-15px 0 45px rgba(0,0,0,.16); display:flex; flex-direction:column; }
.cart-drawer[hidden] { display:none!important; }
.cart-head { display:flex; align-items:center; justify-content:space-between; border-bottom:1px solid #eee; padding-bottom:14px; color:#123b3e; }
.cart-head button { width:36px; height:36px; border:0; border-radius:50%; font-size:25px; background:#f3f1ed; color:#123b3e; }
.cart-items { padding-block:12px; overflow:auto; flex:1; }
.cart-empty { padding:38px 14px; text-align:center; color:#85857f; line-height:1.8; font-size:13px; }
.cart-row { display:grid; grid-template-columns:1fr auto; gap:8px; align-items:center; padding:14px 0; border-bottom:1px solid #f0efeb; color:#254448; font-size:13px; }
.cart-row small { display:block; color:#888; font-size:11px; margin-top:5px; }
.cart-row button { border:0; background:none; color:#a44c66; font-size:11px; }
.cart-foot { display:grid; gap:13px; border-top:1px solid #eee; padding-top:16px; }
.cart-foot > div { display:flex; justify-content:space-between; color:#24464a; font-size:13px; }
.cart-foot small { color:#8a8b85; font-size:10px; line-height:1.6; }
.toast { position:fixed; z-index:60; inset-block-end:25px; inset-inline-start:50%; transform:translate(-50%,20px); opacity:0; pointer-events:none; padding:12px 18px; border-radius:99px; color:#fff; background:#123b3e; box-shadow:0 12px 30px rgba(0,0,0,.18); font-size:12px; transition:opacity .25s,transform .25s; }
.toast.show { opacity:1; transform:translate(-50%,0); }
html[dir="ltr"] .product-head .section-head { text-align:left; }
html[dir="ltr"] .cart-drawer { inset-inline-end:auto; inset-inline-start:0; box-shadow:15px 0 45px rgba(0,0,0,.16); }
html[dir="ltr"] .faq-question { text-align:left; }

@media (max-width:900px) {
  .product-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .product-image-wrap { aspect-ratio:1/1; }
}
@media (max-width:680px) {
  .nav { gap:8px; }
  .nav-actions { gap:5px; }
  .nav-actions .icon-button { width:34px;height:34px; }
  .nav-actions .language-toggle { height:34px; min-width:38px; padding-inline:8px; }
  .hero-grid { grid-template-rows:auto 285px 26px; }
  .hero-visual { min-height:285px; }
  .hero-illustration { min-height:285px; max-height:285px; object-position:70% 52%; }
  .product-head { align-items:flex-start; flex-direction:column; }
  .product-head .button { align-self:flex-start; }
  .product-grid { gap:10px; }
  .product-info { padding:11px; }
  .product-info h3 { font-size:14px; }
  .product-info p { min-height:50px; font-size:10px; }
  .product-buy { flex-direction:column; align-items:stretch; }
  .product-buy > strong { text-align:right; }
  .add-button { justify-content:center; }
  .builder-layout { grid-template-columns:1fr; }
  .builder-photo { min-height:280px; }
  .builder-panel { padding:25px 20px; }
}

@media (max-width: 900px) {
  .nav { gap: 14px; }
  .nav-links { gap: 12px; }
  .hero-grid { grid-template-rows: minmax(420px,auto) 32px; gap: 5px 18px; }
  .hero-copy-card { min-height: 390px; padding: 27px; }
  .hero-visual { min-height: 400px; }
  .hero-float-card { padding: 10px; }
  .occasion-image { min-height: 185px; }
}
@media (max-width: 680px) {
  .announcement-inner { justify-content: center; min-height: 29px; font-size: 10px; }
  .announcement-inner span:last-child { display: none; }
  .nav { min-height: 68px; }
  .nav-actions { gap: 6px; }
  .nav-actions .icon-button { width: 35px; height: 35px; }
  .nav-actions .button { min-height: 39px; padding-inline: 11px; font-size: 11px; }
  .nav-links { top: 68px; }
  .search-popover { top: calc(100% + 4px); right: 16px; left: 16px; width: auto; }
  .hero-carousel { padding-top: 20px; }
  .hero-grid { grid-template-columns: 1fr; grid-template-rows: auto 300px 26px; gap: 0; padding-bottom: 5px; }
  .hero-copy-card { grid-column: 1; grid-row: 1; min-height: 0; width: 100%; padding: 23px 22px; border-radius: 13px; }
  .hero-copy-card h1 { font-size: clamp(32px,9vw,44px); line-height: 1.3; margin: 16px 0 10px; }
  .hero-copy-card .hero-copy { font-size: 13px; margin-bottom: 15px; }
  .hero-copy-card .hero-actions .button { min-height: 43px; padding-inline: 14px; font-size: 12px; }
  .hero-note { margin-top: 12px; }
  .hero-visual { grid-column: 1; grid-row: 2; min-height: 300px; margin-top: 4px; }
  .hero-illustration { max-height: 310px; width: min(100%,390px); }
  .hero-float-card { padding: 8px 10px; gap: 7px; }
  .hero-float-card strong { font-size: 10px; }
  .hero-float-card small { font-size: 9px; }
  .float-top { top: 25px; left: 0; }
  .float-bottom { right: 0; bottom: 12px; }
  .carousel-arrow { top: auto; bottom: 11px; width: 34px; height: 34px; }
  .carousel-prev { right: 2px; }
  .carousel-next { left: 2px; }
  .carousel-dots { grid-column: 1; grid-row: 3; }
  .hero-delivery { font-size: 10px; line-height: 1.7; padding: 10px 18px; }
  .trust-items { flex-wrap: wrap; gap: 10px 15px; justify-content: space-around; min-height: 74px; padding-block: 12px; }
  .trust-items i { display: none; }
  .trust-items div { gap: 5px; }
  .trust-items small { font-size: 9px; }
  .trust-items strong { font-size: 12px; }
  .shop-by-occasion { padding-top: 48px; }
  .occasion-grid { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 10px; }
  .occasion-image { min-height: 135px; }
  .occasion-image:before { width: 115px; height: 115px; }
  .occasion-image svg { width: 65px; height: 65px; }
  .occasion-copy { padding: 12px; }
  .occasion-copy h3 { font-size: 14px; }
  .occasion-copy p { font-size: 10px; }
  .occasion-arrow { font-size: 16px; }
  .style-grid { grid-template-columns: 1fr; gap: 11px; }
  .style-card { min-height: 175px; }
  .partners-band { grid-template-columns: 1fr; gap: 24px; }
  .partner-showcase-card { min-height: 120px; }
  .app-banner { grid-template-columns: 1fr; padding: 27px 22px 0; }
  .app-banner img { width: 220px; margin: -12px auto -50px; }
  .section { padding: 48px 0; }
  .partner-section { padding-top: 15px; }
}
