*{box-sizing:border-box} :root{--night:#100d20;--night2:#1b1230;--purple:#302044;--gold:#d9a34f;--gold-light:#f3d9a2;--cream:#fff8ed;--ink:#21182b;--muted:#776d79}
html{scroll-behavior:smooth;scroll-padding-top:90px}body{margin:0;background:var(--night);color:var(--cream);font-family:"Cairo",sans-serif;line-height:1.8}a{color:inherit;text-decoration:none}.site-header{height:82px;display:flex;align-items:center;justify-content:space-between;padding:0 clamp(18px,6vw,90px);gap:25px;background:#100d20f5;border-bottom:1px solid #b7823d55;position:sticky;top:0;z-index:20}.brand{display:flex;align-items:center;gap:12px;min-width:max-content}.brand-mark{width:42px;height:42px;border:1px solid var(--gold);border-radius:50%;display:grid;place-items:center;color:var(--gold-light);font-size:26px}.brand strong{display:block;color:var(--gold-light);font-family:"Amiri",serif;font-size:23px;line-height:1.25}.brand small{display:block;color:#c5b7c6;font-size:10px}.nav{display:flex;gap:clamp(12px,2.3vw,32px);font-size:13px}.nav a:hover,.site-footer a:hover{color:var(--gold-light)}.header-cta,.button{border:0;border-radius:30px;padding:10px 22px;font:600 13px "Cairo",sans-serif;display:inline-flex;align-items:center;gap:12px;cursor:pointer}.header-cta,.button-gold{background:linear-gradient(120deg,#f4dfb6,#d8a04b);color:#28182a;box-shadow:0 6px 22px #0002}.menu-toggle{display:none;background:none;color:var(--gold-light);border:1px solid #d9a34f88;border-radius:8px;padding:7px 12px;font-size:20px}
.hero{min-height:650px;position:relative;isolation:isolate;display:flex;align-items:center;padding:70px clamp(22px,10vw,150px);overflow:hidden;background:radial-gradient(ellipse at 78% 50%,#79472766 0,transparent 30%),radial-gradient(ellipse at 70% 20%,#604274 0,transparent 38%),linear-gradient(115deg,#0b0b18 10%,#1c1230 62%,#321d32)}.hero:before{content:"";position:absolute;inset:0;z-index:-1;opacity:.5;background-image:radial-gradient(#ffe3a4 1px,transparent 1.5px),radial-gradient(#bca1f0 1px,transparent 1.5px);background-size:63px 63px,91px 91px;background-position:0 0,25px 30px}.hero:after{content:"☾  ✦  ✧  ☽";position:absolute;left:4%;bottom:8%;font-size:50px;letter-spacing:16px;color:#d9a34f44}.hero-content{max-width:610px;position:relative;z-index:2}.eyebrow{color:#b98b45;font-size:12px;letter-spacing:1px;margin:0 0 8px}.hero h1{font:400 clamp(38px,5vw,62px)/1.35 "Amiri",serif;margin:0 0 18px;color:#fff8ef}.hero h1 span{color:#d9a34f}.hero-copy{max-width:550px;color:#d9cfdc;font-size:16px;line-height:2;margin:0 0 26px}.button span{font-size:18px}.trust-row{display:flex;gap:36px;margin-top:42px}.trust-row div{display:flex;align-items:center;gap:10px;color:#e8d7b5}.trust-row div>span{font-size:25px;color:var(--gold)}.trust-row small{font-size:11px;line-height:1.5}.hero-orb{position:absolute;border-radius:50%;border:1px solid #d9a34f66;box-shadow:0 0 50px #d9a34f15,inset 0 0 35px #d9a34f10}.orb-one{width:400px;height:400px;right:8%;top:18%}.orb-two{width:280px;height:280px;right:13%;top:27%}.hero-caption{position:absolute;bottom:22px;right:clamp(22px,10vw,150px);font-size:11px;color:#b9a7bd}
.section-light{background:var(--cream);color:var(--ink)}.services{padding:76px clamp(20px,8vw,120px) 62px;background-image:radial-gradient(#d8b87922 1px,transparent 1px);background-size:20px 20px}.section-heading{text-align:center;margin:0 auto 35px;max-width:700px}.section-heading h2,.about h2,.contact h2{font:700 clamp(30px,4vw,42px)/1.3 "Amiri",serif;margin:0 0 8px}.section-heading>p:last-child{margin:0;color:#8a7c88;font-size:14px}.service-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;max-width:1120px;margin:auto}.service-card{padding:30px 24px 24px;border:1px solid #d8bd8d;border-radius:10px;background:#fffdf8;box-shadow:0 10px 30px #37213c0a;transition:transform .2s,box-shadow .2s}.service-card:hover{transform:translateY(-5px);box-shadow:0 16px 35px #37213c16}.card-symbol{font-size:35px;color:#b47c31}.service-card h3{font:700 22px/1.5 "Amiri",serif;margin:8px 0 12px;color:#9a6428}.service-card p{font-size:13px;color:#776c79;min-height:90px}.service-card a{font-size:13px;color:#9a6428;font-weight:700;display:flex;justify-content:space-between;border-top:1px solid #eee2d1;padding-top:14px}.note{text-align:center;color:#928691;font-size:11px;margin:30px auto 0;max-width:800px}
.about{display:grid;grid-template-columns:.8fr 1.2fr 1fr;align-items:center;gap:38px;padding:75px clamp(20px,8vw,120px);background:linear-gradient(135deg,#171126,#241733 65%,#120e20);border-top:1px solid #c4944d44;border-bottom:1px solid #c4944d44}.about-art{height:300px;border:1px solid #bd8e4d77;border-radius:48% 48% 42% 42%;display:grid;place-items:center;position:relative;overflow:hidden;background:radial-gradient(circle,#58365c 0,#241832 50%,#120e20 80%)}.about-art:before,.about-art:after{content:"";position:absolute;border:1px solid #d9a34f55;border-radius:50%;width:220px;height:220px}.about-art:after{width:280px;height:280px}.moon{font-size:105px;color:#edc779;z-index:1}.star{position:absolute;top:40px;left:25%;font-size:32px;color:#edc779}.orbit{position:absolute;width:320px;height:100px;border:1px solid #d9a34f55;border-radius:50%;transform:rotate(-35deg)}.about-copy p:not(.eyebrow){color:#d2c4d6;font-size:14px}.button-dark{background:#a97936;color:#fff8ed;margin-top:10px}blockquote{margin:0;padding:32px;border:1px solid #b9894b66;border-radius:10px;text-align:center;background:#100c1d77}blockquote .quote-mark{font:70px "Amiri",serif;color:#d9a34f;line-height:1}blockquote p{font:italic 22px/1.8 "Amiri",serif;color:#f4e7cf}blockquote .quote-stars{color:#d9a34f;letter-spacing:12px}
.section-dark{padding:68px 20px;background:radial-gradient(ellipse at center,#332041,#110d1e 70%)}.steps{max-width:1000px;margin:auto;display:grid;grid-template-columns:repeat(3,1fr);gap:25px;text-align:center}.step{padding:20px}.step>span{display:inline-grid;place-items:center;width:54px;height:54px;border:1px solid #d9a34f;border-radius:50%;color:#f2d39a;font:700 25px "Amiri",serif}.step h3{font:700 21px "Amiri",serif;color:#f2d39a}.step p{font-size:13px;color:#c4b7ca}
.contact{display:grid;grid-template-columns:1fr 1fr;gap:60px;padding:75px clamp(20px,10vw,145px);background-image:radial-gradient(#d8b87922 1px,transparent 1px);background-size:18px 18px}.contact-copy>p:not(.eyebrow){color:#776d79;max-width:500px}.contact-detail{display:flex;align-items:center;gap:12px;color:#776d79;font-size:13px;margin:18px 0}.contact-detail span:first-child{font-size:20px;color:#a97936}.contact-form{padding:28px;background:#fffdf9;border:1px solid #e5d5bd;border-radius:12px;box-shadow:0 12px 30px #2b19310b}.contact-form label{display:block;color:#655968;font-size:12px;margin-bottom:13px}.contact-form input,.contact-form select,.contact-form textarea{width:100%;display:block;margin-top:5px;padding:12px;border:1px solid #e2d8cd;border-radius:6px;background:#fff;color:#302438;font:13px "Cairo",sans-serif;outline-color:#c49a58}.contact-form textarea{resize:vertical}.form-help{font-size:10px;color:#9a8e9b;margin:8px 0 0}.site-footer{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:25px clamp(20px,8vw,120px);background:#0b0915;color:#b7aabb;font-size:11px}.site-footer p{margin:0}.site-footer>a:last-child{color:#d7b576}
@media(max-width:850px){.site-header{height:72px;padding:0 18px;gap:10px}.brand strong{font-size:20px}.brand small{font-size:9px}.header-cta{padding:8px 13px;font-size:11px}.nav{gap:12px;font-size:11px}.hero{min-height:590px;padding:60px 28px}.orb-one{right:-110px;opacity:.65}.orb-two{right:-45px;opacity:.6}.hero-content{max-width:570px}.about{grid-template-columns:1fr 1.3fr}.about-art{height:240px}blockquote{grid-column:1/-1}.service-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.contact{gap:25px;padding:55px 25px}}
@media(max-width:600px){.site-header{flex-wrap:wrap;height:auto;min-height:70px;padding:12px 16px}.menu-toggle{display:block;margin-right:auto}.nav{display:none;order:4;flex-basis:100%;flex-direction:column;gap:0;padding:8px 0}.nav.open{display:flex}.nav a{padding:8px;border-top:1px solid #ffffff12;font-size:13px}.header-cta{display:none}.hero{min-height:610px;padding:50px 22px 75px}.hero h1{font-size:39px}.hero-copy{font-size:14px}.hero-caption{right:22px;left:22px}.trust-row{gap:18px}.orb-one{width:260px;height:260px;right:-125px;top:8%}.orb-two{width:190px;height:190px;right:-90px;top:14%}.service-grid{grid-template-columns:1fr}.service-card p{min-height:0}.about{grid-template-columns:1fr;padding:50px 22px}.about-art{height:220px;max-width:300px;width:100%;margin:auto}.about-copy{grid-row:1}.steps{grid-template-columns:1fr;gap:0}.step{padding:15px}.contact{grid-template-columns:1fr;padding:50px 20px}.site-footer{flex-direction:column;text-align:center}.site-footer .brand{justify-content:center}.section-heading h2,.about h2,.contact h2{font-size:32px}}
.tiktok-button {
  display: inline-block;
  background: linear-gradient(135deg, #25F4EE, #FE2C55);
  color: white;
  padding: 12px 24px;
  border-radius: 12px;
  text-decoration: none;
  font-weight: bold;
  text-align: center;
  transition: transform 0.2s ease;
}

.tiktok-button:hover {
  transform: scale(1.05);
}

/* WhatsApp and TikTok buttons — Tarot Amal */
.tiktok-button,
.contact-form button[type="submit"] {
  box-sizing: border-box;
  width: 100%;
  min-height: 50px;
  padding: 13px 20px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  border-radius: 14px;
  font-family: "Cairo", sans-serif;
  font-size: 14px;
  font-weight: 700;
  text-align: center;
  cursor: pointer;
  text-decoration: none;
  transition: transform 0.2s ease, box-shadow 0.2s ease;
}

/* WhatsApp */
.contact-form button[type="submit"] {
  background: linear-gradient(135deg, #25D366, #128C4A);
  color: #fff;
  border: 1px solid #25D366;
  box-shadow: 0 5px 16px #128C4A30;
}

/* TikTok */
.tiktok-button {
  background: #080808;
  color: #fff;
  border: 1px solid #25F4EE;
  box-shadow: 3px 3px 0 #FE2C55;
}

.tiktok-button:hover,
.contact-form button[type="submit"]:hover {
  transform: translateY(-2px);
}

.tiktok-button:focus-visible,
.contact-form button[type="submit"]:focus-visible {
  outline: 3px solid #D9A34F;
  outline-offset: 3px;
}

@media (max-width: 600px) {
  .tiktok-button,
  .contact-form button[type="submit"] {
    min-height: 48px;
    padding: 12px 14px;
    font-size: 13px;
    border-radius: 12px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .tiktok-button,
  .contact-form button[type="submit"] {
    transition: none;
  }
}
/* رابط تيك توك بدون إطار أو خلفية */
.tiktok-button {
background: transparent !important;
border: none !important;
box-shadow: none !important;
color: inherit;
padding: 8px 0;
min-height: auto;
width: auto;
text-decoration: none;
}

/* إخفاء شعار تيك توك والإبقاء على الكتابة فقط */
.tiktok-button svg {
  display: inline-block !important;
  width: 26px;
  height: 26px;
  flex-shrink: 0;
}

.tiktok-button:hover {
transform: none;
text-decoration: underline;
}
.tiktok-button {
display: flex !important;
width: 100% !important;
box-sizing: border-box;
align-items: center !important;
justify-content: center !important;
gap: 9px;
padding: 12px 0;
margin: 0 auto;
background: transparent !important;
border: none !important;
box-shadow: none !important;
color: inherit;
text-align: center !important;
text-decoration: none;
direction: rtl;
}

.tiktok-button svg {
display: block !important;
visibility: visible !important;
width: 26px;
height: 26px;
flex-shrink: 0;
}

.tiktok-button span {
display: inline-block;
}

.tiktok-button:hover {
text-decoration: underline;
}

/* Large circular tarot images: prioritize a bold visual; top/bottom cropping is intentional */
.service-image {
  display: block;
  width: 280px;
  height: 280px;
  max-width: 100%;
  box-sizing: border-box;
  padding: 0;
  margin: 14px auto 18px;
  object-fit: cover;
  object-position: center;
  border-radius: 50%;
  box-shadow: 0 4px 14px rgba(0, 0, 0, 0.18);
}

@media (max-width: 600px) {
  .service-image {
    width: 240px;
    height: 240px;
    margin: 10px auto 14px;
  }
}


/* Pricing section inspired by the original Tarot Amal website */
.pricing {
  background: #c87524;
  color: #fffaf2;
  text-align: center;
  padding: 58px 22px 64px;
}
.pricing-inner {
  max-width: 900px;
  margin: 0 auto;
}
.pricing h2 {
  font: 700 clamp(30px, 4.5vw, 42px)/1.5 "Amiri", serif;
  margin: 0 0 22px;
  color: #fffaf2;
}
.pricing p {
  max-width: 850px;
  margin: 0 auto 34px;
  font: 400 clamp(18px, 2.5vw, 26px)/1.9 "Cairo", sans-serif;
  color: #fffaf2;
}
.pricing-cta {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 220px;
  min-height: 72px;
  padding: 14px 32px;
  background: #fff;
  color: #77706c;
  border: 1px solid #f5eee5;
  border-radius: 0;
  font: 600 23px "Cairo", sans-serif;
  box-shadow: 0 3px 10px rgba(75, 37, 8, .12);
  transition: transform .2s ease, background .2s ease;
}
.pricing-cta:hover {
  background: #fff5e8;
  transform: translateY(-2px);
}
@media (max-width: 600px) {
  .pricing { padding: 44px 20px 48px; }
  .pricing h2 { font-size: 29px; }
  .pricing p { font-size: 17px; line-height: 1.9; }
  .pricing-cta { min-width: 190px; min-height: 60px; font-size: 20px; }
}