:root {
  --red: #ed2f24;
  --red-dark: #c91f17;
  --red-soft: #fff0ee;
  --ink: #141414;
  --ink-2: #292929;
  --muted: #6d6d6d;
  --line: #e6e1de;
  --paper: #f6f4f2;
  --paper-2: #efedea;
  --white: #ffffff;
  --green: #08a95d;
  --danger: #b42318;
  --success: #067647;
  --shadow-sm: 0 12px 35px rgba(24, 18, 16, .07);
  --shadow-lg: 0 30px 80px rgba(24, 18, 16, .14);
  --radius-sm: 14px;
  --radius-md: 22px;
  --radius-lg: 34px;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: 92px; }
body {
  margin: 0;
  font-family: "Noto Sans Arabic", "Segoe UI", Tahoma, Arial, sans-serif;
  background: var(--white);
  color: var(--ink);
  line-height: 1.75;
  -webkit-font-smoothing: antialiased;
}
img { max-width: 100%; display: block; }
a { color: inherit; }
button, input, textarea { font: inherit; }
[hidden] { display: none !important; }

.container { width: min(1160px, calc(100% - 36px)); margin-inline: auto; }
.section { padding: 92px 0; }

.site-header {
  position: sticky;
  top: 0;
  z-index: 50;
  background: rgba(255, 255, 255, .92);
  backdrop-filter: blur(18px);
  border-bottom: 1px solid rgba(20, 20, 20, .07);
}
.header-inner {
  min-height: 78px;
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: center;
  gap: 28px;
}
.brand { justify-self: start; display: inline-flex; text-decoration: none; }
.brand img { width: 146px; height: 55px; object-fit: contain; }
.desktop-nav { display: flex; gap: 28px; align-items: center; }
.desktop-nav a {
  text-decoration: none;
  font-size: .95rem;
  font-weight: 800;
  color: #444;
  transition: color .2s ease;
}
.desktop-nav a:hover { color: var(--red); }
.header-cta {
  justify-self: end;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 124px;
  padding: 10px 20px;
  border-radius: 999px;
  background: var(--red);
  color: #fff;
  text-decoration: none;
  font-weight: 900;
  box-shadow: 0 10px 24px rgba(237, 47, 36, .25);
  transition: transform .2s ease, background .2s ease;
}
.header-cta:hover { transform: translateY(-2px); background: var(--red-dark); }

.hero {
  position: relative;
  overflow: hidden;
  padding: 86px 0 60px;
  background:
    radial-gradient(circle at 10% 0%, rgba(237, 47, 36, .09), transparent 30%),
    linear-gradient(180deg, #fff, #faf8f6);
}
.hero::before {
  content: "";
  position: absolute;
  width: 360px;
  height: 360px;
  left: -180px;
  top: 90px;
  border: 45px solid rgba(237, 47, 36, .06);
  border-radius: 50%;
}
.hero-grid {
  position: relative;
  z-index: 2;
  display: grid;
  grid-template-columns: .92fr 1.08fr;
  align-items: center;
  gap: clamp(44px, 7vw, 86px);
}
.eyebrow,
.section-kicker {
  display: inline-flex;
  align-items: center;
  gap: 9px;
  color: var(--red);
  font-weight: 900;
  font-size: .94rem;
}
.eyebrow {
  padding: 7px 13px;
  background: var(--red-soft);
  border: 1px solid #ffd8d3;
  border-radius: 999px;
}
.eyebrow i { width: 8px; height: 8px; background: var(--red); border-radius: 50%; box-shadow: 0 0 0 5px rgba(237,47,36,.12); }
.hero h1 {
  margin: 21px 0 17px;
  font-size: clamp(2.7rem, 5.7vw, 5.2rem);
  line-height: 1.07;
  letter-spacing: -.045em;
  font-weight: 950;
}
.hero h1 em,
.section-heading h2 em { color: var(--red); font-style: normal; position: relative; }
.hero h1 em::after {
  content: "";
  position: absolute;
  right: 2%;
  left: 2%;
  bottom: -7px;
  height: 9px;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 200 16'%3E%3Cpath d='M2 10 C25 2 40 15 62 8 S100 5 121 9 S160 2 198 8' fill='none' stroke='%23ed2f24' stroke-width='5' stroke-linecap='round'/%3E%3C/svg%3E") center/100% 100% no-repeat;
}
.hero-copy > p {
  max-width: 620px;
  margin: 0;
  color: var(--muted);
  font-size: 1.12rem;
  line-height: 1.9;
}
.hero-actions { display: flex; flex-wrap: wrap; gap: 13px; margin-top: 30px; }
.primary-link,
.secondary-link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 54px;
  padding: 12px 27px;
  border-radius: 15px;
  text-decoration: none;
  font-weight: 900;
  transition: transform .2s ease, box-shadow .2s ease;
}
.primary-link { color: #fff; background: var(--red); box-shadow: 0 13px 30px rgba(237,47,36,.24); }
.secondary-link { color: var(--ink); background: #fff; border: 1px solid var(--line); }
.primary-link:hover, .secondary-link:hover { transform: translateY(-2px); }
.trust-row { display: flex; flex-wrap: wrap; gap: 16px 22px; margin-top: 27px; color: #464646; font-size: .91rem; font-weight: 750; }
.trust-row span { display: inline-flex; align-items: center; gap: 6px; }
.trust-row b { display: grid; place-items: center; width: 19px; height: 19px; border-radius: 50%; background: #e5f8ee; color: var(--green); font-size: .75rem; }

.hero-visual-wrap { position: relative; min-height: 580px; display: grid; place-items: center; }
.hero-visual {
  position: relative;
  z-index: 2;
  width: min(520px, 88%);
  margin: 0;
  overflow: hidden;
  border-radius: 40px 40px 88px 40px;
  border: 9px solid #fff;
  background: #ecebea;
  box-shadow: var(--shadow-lg);
  transform: rotate(1.4deg);
}
.hero-visual img { width: 100%; aspect-ratio: 1.05 / 1; object-fit: cover; }
.hero-shape { position: absolute; border-radius: 50%; }
.hero-shape-one { width: 460px; height: 460px; background: var(--red); opacity: .95; right: 3%; top: 4%; }
.hero-shape-two { width: 190px; height: 190px; border: 26px solid #171717; opacity: .06; left: 3%; bottom: 4%; }
.floating-card {
  position: absolute;
  z-index: 4;
  background: rgba(255,255,255,.97);
  border: 1px solid rgba(20,20,20,.08);
  box-shadow: 0 17px 45px rgba(19,14,12,.16);
  border-radius: 20px;
}
.floating-price { left: -2%; top: 12%; padding: 15px 19px; transform: rotate(-3deg); }
.floating-price small, .floating-price span { display: block; color: var(--muted); line-height: 1.45; font-size: .78rem; }
.floating-price strong { display: block; color: var(--red); font-size: 2rem; line-height: 1.15; }
.floating-quality { right: -2%; bottom: 10%; display: flex; align-items: center; gap: 12px; padding: 13px 16px; }
.floating-quality .floating-icon { width: 42px; height: 42px; display: grid; place-items: center; border-radius: 14px; background: var(--red-soft); color: var(--red); font-size: 1.2rem; }
.floating-quality strong, .floating-quality small { display: block; line-height: 1.5; }
.floating-quality small { color: var(--muted); font-size: .75rem; }
.scribble-line { width: min(1120px, calc(100% - 50px)); height: 17px; margin: 44px auto 0; background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1000 22'%3E%3Cpath d='M3 10 C18 1 28 21 43 10 S68 1 83 10 S108 21 123 10 S148 1 163 10 S188 21 203 10 S228 1 243 10 S268 21 283 10 S308 1 323 10 S348 21 363 10 S388 1 403 10 S428 21 443 10 S468 1 483 10 S508 21 523 10 S548 1 563 10 S588 21 603 10 S628 1 643 10 S668 21 683 10 S708 1 723 10 S748 21 763 10 S788 1 803 10 S828 21 843 10 S868 1 883 10 S908 21 923 10 S948 1 997 10' fill='none' stroke='%23ed2f24' stroke-width='4' stroke-linecap='round'/%3E%3C/svg%3E") center/100% 100% no-repeat; }

.quick-proof { background: var(--ink); color: #fff; }
.proof-grid { display: grid; grid-template-columns: repeat(4, 1fr); }
.proof-grid > div { padding: 24px 20px; text-align: center; border-inline-start: 1px solid rgba(255,255,255,.12); }
.proof-grid > div:first-child { border-inline-start: 0; }
.proof-grid strong { display: block; font-size: 1.45rem; color: #fff; }
.proof-grid span { color: #bcbcbc; font-size: .85rem; }

.section-heading { max-width: 740px; margin: 0 auto 46px; text-align: center; }
.section-heading.compact { margin-bottom: 34px; }
.section-heading h2,
.uses-copy h2,
.faq-heading h2 {
  margin: 8px 0 12px;
  font-size: clamp(2rem, 4.2vw, 3.55rem);
  line-height: 1.25;
  letter-spacing: -.035em;
  font-weight: 950;
}
.section-heading p, .uses-copy > p, .faq-heading p { margin: 0; color: var(--muted); font-size: 1.04rem; }

.advantages-section { background: #fff; }
.benefit-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }
.benefit-card {
  min-height: 285px;
  padding: 31px;
  border: 1px solid var(--line);
  border-radius: var(--radius-md);
  background: #fff;
  box-shadow: var(--shadow-sm);
  transition: transform .25s ease, box-shadow .25s ease;
}
.benefit-card:hover { transform: translateY(-5px); box-shadow: 0 20px 50px rgba(24,18,16,.11); }
.benefit-card.featured { background: var(--ink); color: #fff; border-color: var(--ink); }
.benefit-icon { width: 58px; height: 58px; display: grid; place-items: center; margin-bottom: 25px; border-radius: 18px; background: var(--red-soft); color: var(--red); }
.featured .benefit-icon { background: var(--red); color: #fff; }
.benefit-icon svg { width: 29px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.benefit-card h3 { margin: 0 0 8px; font-size: 1.3rem; }
.benefit-card p { margin: 0; color: var(--muted); }
.featured p { color: #c9c9c9; }

.uses-section { background: var(--paper); overflow: hidden; }
.uses-layout { display: grid; grid-template-columns: .95fr 1.05fr; gap: clamp(45px, 7vw, 92px); align-items: center; }
.uses-copy > p { max-width: 560px; }
.use-list { display: grid; gap: 12px; margin-top: 31px; }
.use-list > div { display: grid; grid-template-columns: 52px 1fr; gap: 15px; align-items: start; padding: 13px 0; border-bottom: 1px solid #dfdbd8; }
.use-list > div > span { width: 48px; height: 48px; display: grid; place-items: center; background: #fff; color: var(--red); border-radius: 15px; font-weight: 950; box-shadow: 0 7px 18px rgba(24,18,16,.06); }
.use-list p { margin: 0; }
.use-list b, .use-list small { display: block; }
.use-list small { color: var(--muted); margin-top: 2px; }
.showcase-frame { position: relative; margin: 0; padding: 18px; border-radius: 36px; background: #fff; box-shadow: var(--shadow-lg); transform: rotate(-1.2deg); }
.showcase-frame::before { content: ""; position: absolute; inset: -26px 26px 26px -26px; border: 3px solid var(--red); border-radius: 40px; z-index: -1; }
.showcase-frame img { width: 100%; aspect-ratio: 1.05 / 1; object-fit: cover; border-radius: 25px; }
.showcase-frame figcaption { padding: 16px 8px 4px; font-weight: 850; }
.showcase-frame figcaption span { color: var(--red); margin-inline-end: 6px; }

.formats-section { background: #fff; }
.format-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 15px; }
.format-grid article { display: grid; place-items: center; text-align: center; min-height: 225px; padding: 24px 18px; border: 1px solid var(--line); border-radius: 23px; background: #fff; transition: border-color .2s ease, transform .2s ease; }
.format-grid article:hover { transform: translateY(-4px); border-color: #f4aaa4; }
.format-grid b, .format-grid small { display: block; }
.format-grid b { margin-top: 18px; font-size: 1.13rem; }
.format-grid small { color: var(--muted); }
.shape { width: 82px; height: 82px; display: grid; place-items: center; background: var(--red-soft); border: 3px solid var(--red); box-shadow: 7px 7px 0 rgba(237,47,36,.12); }
.shape-circle { border-radius: 50%; }
.shape-square { border-radius: 18px; }
.shape-rectangle { width: 112px; height: 72px; border-radius: 18px; }
.shape-custom { border-radius: 36% 64% 57% 43% / 50% 41% 59% 50%; color: var(--red); font-size: 2rem; }
.format-note { width: fit-content; max-width: 100%; margin: 27px auto 0; padding: 10px 18px; border-radius: 999px; background: var(--paper); color: #555; text-align: center; }

.pricing-section { background: var(--ink); color: #fff; position: relative; overflow: hidden; }
.pricing-section::before, .pricing-section::after { content: ""; position: absolute; border-radius: 50%; background: var(--red); opacity: .12; }
.pricing-section::before { width: 380px; height: 380px; right: -210px; top: -190px; }
.pricing-section::after { width: 240px; height: 240px; left: -120px; bottom: -110px; }
.pricing-section .section-heading { position: relative; z-index: 2; }
.pricing-section .section-heading p { color: #bdbdbd; }
.price-grid { position: relative; z-index: 2; display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; align-items: stretch; }
.price-card { position: relative; display: flex; flex-direction: column; align-items: center; text-align: center; padding: 32px 24px; border-radius: 25px; background: #fff; color: var(--ink); border: 1px solid rgba(255,255,255,.1); }
.price-card.popular { transform: translateY(-12px); border: 3px solid var(--red); box-shadow: 0 28px 65px rgba(0,0,0,.28); }
.popular-tag { position: absolute; top: -17px; right: 50%; transform: translateX(50%); padding: 6px 16px; border-radius: 999px; background: var(--red); color: #fff; font-size: .82rem; font-weight: 900; white-space: nowrap; }
.price-label { color: var(--red); font-size: .88rem; font-weight: 900; }
.price-card h3 { margin: 14px 0 0; font-size: 1.65rem; }
.price-card p { margin: 0; color: var(--muted); }
.price-card > strong { display: flex; align-items: baseline; gap: 5px; margin-top: 18px; color: var(--red); font-size: 1.2rem; }
.price-card > strong b { font-size: 3rem; line-height: 1; }
.price-card > small { color: var(--muted); }
.price-card a { width: 100%; margin-top: 24px; padding: 11px 18px; border-radius: 13px; background: var(--ink); color: #fff; text-decoration: none; font-weight: 900; }
.popular a { background: var(--red); }
.pricing-note { position: relative; z-index: 2; width: fit-content; max-width: 100%; margin: 34px auto 0; display: flex; align-items: center; flex-wrap: wrap; justify-content: center; gap: 8px 12px; padding: 12px 22px; border: 1px solid rgba(255,255,255,.16); border-radius: 999px; background: rgba(255,255,255,.06); }
.pricing-note span { color: #78e5ab; }
.pricing-note i { width: 1px; height: 20px; background: rgba(255,255,255,.2); }

.process-section { background: var(--paper); }
.process-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 23px; counter-reset: process; }
.process-grid article { position: relative; padding: 35px 30px 31px; border-radius: 25px; background: #fff; border: 1px solid var(--line); box-shadow: var(--shadow-sm); }
.process-grid article:not(:last-child)::after { content: "←"; position: absolute; top: 50%; left: -28px; transform: translateY(-50%); color: var(--red); font-size: 2rem; font-weight: 900; z-index: 3; }
.process-grid article > span { width: 48px; height: 48px; display: grid; place-items: center; border-radius: 15px; background: var(--red); color: #fff; font-size: 1.2rem; font-weight: 950; }
.process-grid h3 { margin: 19px 0 7px; font-size: 1.25rem; }
.process-grid p { margin: 0; color: var(--muted); }

.preorder-banner { padding: 0 0 92px; background: var(--paper); }
.preorder-inner { position: relative; overflow: hidden; display: flex; align-items: center; justify-content: space-between; gap: 30px; padding: 38px 44px; border-radius: 30px; background: var(--red); color: #fff; box-shadow: 0 24px 50px rgba(237,47,36,.24); }
.preorder-inner::after { content: ""; position: absolute; width: 230px; height: 230px; left: -70px; top: -95px; border: 35px solid rgba(255,255,255,.12); border-radius: 50%; }
.preorder-inner > * { position: relative; z-index: 2; }
.preorder-inner span { opacity: .84; }
.preorder-inner h2 { margin: 4px 0 0; max-width: 670px; font-size: clamp(1.6rem, 3vw, 2.5rem); line-height: 1.35; }
.preorder-inner a { flex: 0 0 auto; padding: 13px 24px; border-radius: 14px; background: #fff; color: var(--red); text-decoration: none; font-weight: 950; }

.order-section { padding: 96px 0; background: #f3f1ef; }
.order-layout { display: grid; grid-template-columns: .82fr 1.18fr; gap: 28px; align-items: stretch; }
.order-aside { position: relative; overflow: hidden; padding: 46px 38px; border-radius: 29px; background: var(--ink); color: #fff; }
.order-aside::before { content: ""; position: absolute; width: 280px; height: 280px; left: -120px; bottom: -120px; background: var(--red); border-radius: 50%; opacity: .85; }
.section-kicker.light { color: #ff6c62; }
.order-aside h2 { margin: 11px 0 13px; font-size: clamp(2rem, 3.6vw, 3.1rem); line-height: 1.3; }
.order-aside > p { color: #bfbfbf; margin: 0; }
.order-aside ul { list-style: none; padding: 0; margin: 31px 0 0; display: grid; gap: 15px; }
.order-aside li { display: flex; gap: 10px; align-items: center; }
.order-aside li span { width: 23px; height: 23px; display: grid; place-items: center; border-radius: 50%; background: rgba(237,47,36,.18); color: #ff7168; font-size: .8rem; }
.order-mini-logo { position: absolute; z-index: 2; left: 24px; bottom: 18px; width: 130px; padding: 7px; border-radius: 14px; background: rgba(255,255,255,.94); }
.order-card { background: #fff; border: 1px solid var(--line); border-radius: 29px; padding: clamp(24px, 5vw, 44px); box-shadow: var(--shadow-lg); }
.form-heading { text-align: center; }
.form-heading > span { color: var(--red); font-weight: 900; }
.form-heading h2 { margin: 4px 0 1px; font-size: 2.15rem; line-height: 1.3; }
.form-heading p { margin: 0; color: var(--muted); }
.steps { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin: 27px 0; }
.steps > span { display: grid; grid-template-columns: 31px 1fr; align-items: center; gap: 9px; padding: 9px 11px; border-radius: 13px; background: #f0efee; color: #8a8a8a; }
.steps > span b { width: 31px; height: 31px; display: grid; place-items: center; border-radius: 10px; background: #d8d5d2; color: #777; }
.steps > span small { font-weight: 800; }
.steps > span.active { background: var(--red-soft); color: var(--ink); }
.steps > span.active b { background: var(--red); color: #fff; }
label { display: grid; gap: 7px; margin-bottom: 17px; color: #333; font-weight: 850; }
input, textarea { width: 100%; border: 1px solid #d8d3d0; background: #fff; border-radius: 14px; padding: 14px 15px; color: var(--ink); outline: none; transition: border-color .2s ease, box-shadow .2s ease; }
input::placeholder, textarea::placeholder { color: #aaa; }
input:focus, textarea:focus { border-color: var(--red); box-shadow: 0 0 0 4px rgba(237,47,36,.1); }
textarea { min-height: 118px; resize: vertical; }
.two-fields { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
button { width: 100%; min-height: 54px; border: 0; border-radius: 14px; padding: 12px 19px; background: var(--red); color: #fff; font: inherit; font-weight: 950; cursor: pointer; box-shadow: 0 12px 26px rgba(237,47,36,.19); transition: transform .2s ease, background .2s ease; }
button:hover:not(:disabled) { transform: translateY(-2px); background: var(--red-dark); }
button:disabled { opacity: .5; cursor: not-allowed; box-shadow: none; }
button > span { margin-inline-start: 6px; }
.back-button { margin-top: 9px; min-height: auto; background: transparent; color: var(--ink); box-shadow: none; text-decoration: underline; }
.back-button:hover:not(:disabled) { background: transparent; transform: none; }
.form-reassurance { margin: 12px 0 0; text-align: center; color: var(--muted); font-size: .84rem; }
.summary { margin-bottom: 19px; padding: 14px 16px; border: 1px solid #f2c9c5; border-radius: 14px; background: var(--red-soft); }
.confirmation { grid-template-columns: auto 1fr; align-items: start; font-weight: 600; }
.confirmation input { width: 20px; height: 20px; margin-top: 4px; accent-color: var(--red); }
.turnstile-container { display: none; min-height: 0; margin: 0; overflow: hidden; }
.turnstile-container.active { display: flex; min-height: 70px; margin: 16px 0; justify-content: center; overflow: visible; }
.form-message { display: none; margin-top: 16px; border-radius: 13px; padding: 13px 15px; text-align: center; }
.form-message.show { display: block; }
.form-message.error { background: #fff0ee; color: var(--danger); }
.form-message.success { background: #ecfdf3; color: var(--success); }
.honeypot { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0, 0, 0, 0) !important; white-space: nowrap !important; border: 0 !important; opacity: 0 !important; }

.faq-section { background: #fff; }
.faq-layout { display: grid; grid-template-columns: .75fr 1.25fr; gap: 70px; align-items: start; }
.faq-heading { position: sticky; top: 120px; }
.faq-list { display: grid; gap: 12px; }
.faq-list details { border: 1px solid var(--line); border-radius: 18px; background: #fff; overflow: hidden; }
.faq-list summary { list-style: none; position: relative; cursor: pointer; padding: 20px 22px; padding-inline-end: 58px; font-weight: 900; }
.faq-list summary::-webkit-details-marker { display: none; }
.faq-list summary::after { content: "+"; position: absolute; left: 20px; top: 50%; transform: translateY(-50%); width: 28px; height: 28px; display: grid; place-items: center; border-radius: 9px; background: var(--red-soft); color: var(--red); font-size: 1.25rem; }
.faq-list details[open] summary::after { content: "−"; }
.faq-list details p { margin: 0; padding: 0 22px 20px; color: var(--muted); }

footer { background: var(--ink); color: #fff; padding: 43px 0 20px; }
.footer-main { display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 28px; }
.footer-logo { display: inline-flex; width: 145px; padding: 7px; background: #fff; border-radius: 14px; }
.footer-main p { margin: 0; color: #aaa; }
.footer-main > a:last-child { color: #d7d7d7; }
.footer-bottom { margin-top: 28px; padding-top: 17px; border-top: 1px solid rgba(255,255,255,.1); color: #888; font-size: .84rem; }
.mobile-order-bar { display: none; }

.thanks-page { min-height: 100vh; display: grid; place-items: center; padding: 24px; background: radial-gradient(circle at 50% 0%, rgba(237,47,36,.13), transparent 35%), var(--paper); }
.thanks-card { width: min(590px, 100%); text-align: center; background: #fff; padding: 42px 30px; border: 1px solid var(--line); border-radius: 30px; box-shadow: var(--shadow-lg); }
.thanks-logo { width: 165px; margin: 0 auto 22px; }
.thanks-icon { width: 78px; height: 78px; display: grid; place-items: center; margin: 0 auto 18px; border-radius: 50%; background: #e5f8ee; color: var(--success); border: 8px solid #f1fcf6; font-size: 2rem; font-weight: 950; }
.thanks-card h1 { margin: 0; font-size: clamp(2rem, 5vw, 3rem); }
.thanks-card p { color: var(--muted); }
.thanks-ref { display: inline-flex; padding: 8px 14px; border-radius: 12px; background: var(--paper); }
.privacy-page { min-height: 100vh; background: var(--paper); padding: 55px 0; }
.privacy-card { width: min(820px, calc(100% - 30px)); margin: auto; padding: 36px; border-radius: 28px; background: #fff; border: 1px solid var(--line); box-shadow: var(--shadow-sm); }
.privacy-card img { width: 150px; margin-bottom: 25px; }
.privacy-card h1 { font-size: clamp(2rem, 4vw, 3rem); }
.privacy-card p { color: #555; }

@media (max-width: 980px) {
  .desktop-nav { display: none; }
  .header-inner { grid-template-columns: 1fr auto; }
  .hero-grid, .uses-layout, .order-layout, .faq-layout { grid-template-columns: 1fr; }
  .hero-copy { text-align: center; }
  .hero-copy > p { margin-inline: auto; }
  .hero-actions, .trust-row { justify-content: center; }
  .hero-visual-wrap { min-height: 540px; max-width: 690px; width: 100%; margin-inline: auto; }
  .benefit-grid, .price-grid, .process-grid { grid-template-columns: 1fr; }
  .benefit-card { min-height: auto; }
  .price-card.popular { transform: none; }
  .process-grid article:not(:last-child)::after { content: "↓"; top: auto; bottom: -34px; left: 50%; transform: translateX(-50%); }
  .format-grid { grid-template-columns: repeat(2, 1fr); }
  .faq-heading { position: static; }
  .order-aside { min-height: 410px; }
}

@media (max-width: 680px) {
  .container { width: min(100% - 22px, 1160px); }
  .section { padding: 70px 0; }
  body { padding-bottom: 76px; }
  .site-header { position: sticky; }
  .header-inner { min-height: 67px; }
  .brand img { width: 119px; height: 46px; }
  .header-cta { min-width: auto; padding: 8px 15px; font-size: .88rem; }
  .hero { padding: 50px 0 35px; }
  .hero h1 { font-size: clamp(2.35rem, 13vw, 3.7rem); }
  .hero-copy > p { font-size: 1rem; }
  .hero-actions { display: grid; grid-template-columns: 1fr 1fr; }
  .primary-link, .secondary-link { padding: 11px 13px; min-height: 51px; }
  .trust-row { gap: 9px 14px; font-size: .82rem; }
  .hero-visual-wrap { min-height: 410px; margin-top: 8px; }
  .hero-visual { width: 88%; border-width: 6px; border-radius: 28px 28px 57px 28px; }
  .hero-shape-one { width: 310px; height: 310px; right: 5%; }
  .hero-shape-two { width: 130px; height: 130px; }
  .floating-price { left: 0; top: 7%; padding: 11px 13px; }
  .floating-price strong { font-size: 1.5rem; }
  .floating-price span { display: none; }
  .floating-quality { right: -1%; bottom: 6%; padding: 10px 12px; }
  .floating-quality .floating-icon { width: 34px; height: 34px; }
  .floating-quality strong { font-size: .82rem; }
  .floating-quality small { font-size: .67rem; }
  .scribble-line { margin-top: 23px; }
  .proof-grid { grid-template-columns: repeat(2, 1fr); }
  .proof-grid > div { border-bottom: 1px solid rgba(255,255,255,.1); }
  .section-heading { margin-bottom: 31px; }
  .section-heading h2, .uses-copy h2, .faq-heading h2 { font-size: clamp(1.85rem, 9vw, 2.65rem); }
  .benefit-grid { gap: 13px; }
  .benefit-card { padding: 25px; }
  .uses-layout { gap: 44px; }
  .showcase-frame { padding: 11px; border-radius: 27px; }
  .showcase-frame::before { inset: -15px 15px 15px -15px; border-radius: 31px; }
  .format-grid { gap: 10px; }
  .format-grid article { min-height: 190px; padding: 20px 10px; }
  .shape { width: 68px; height: 68px; }
  .shape-rectangle { width: 92px; height: 60px; }
  .pricing-note { border-radius: 18px; }
  .preorder-banner { padding-bottom: 70px; }
  .preorder-inner { padding: 29px 23px; flex-direction: column; align-items: stretch; text-align: center; }
  .preorder-inner a { text-align: center; }
  .order-section { padding: 70px 0; }
  .order-aside { min-height: 430px; padding: 34px 24px; }
  .order-card { padding: 25px 15px; border-radius: 22px; }
  .steps > span { grid-template-columns: 28px 1fr; padding: 8px; }
  .steps > span b { width: 28px; height: 28px; }
  .steps > span small { font-size: .74rem; }
  .two-fields { grid-template-columns: 1fr; gap: 0; }
  .faq-layout { gap: 30px; }
  .footer-main { grid-template-columns: 1fr; text-align: center; justify-items: center; }
  .footer-main p { max-width: 430px; }
  .footer-bottom { text-align: center; }
  .mobile-order-bar {
    position: fixed;
    z-index: 80;
    right: 11px;
    left: 11px;
    bottom: 10px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 14px 20px;
    border-radius: 17px;
    background: var(--red);
    color: #fff;
    text-decoration: none;
    font-weight: 950;
    box-shadow: 0 15px 35px rgba(30,17,14,.26);
  }
  .mobile-order-bar b { font-size: 1.3rem; }
  .thanks-card { padding: 35px 20px; }
  .privacy-card { padding: 26px 20px; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { transition: none !important; }
}