/*
Theme Name: Faten Shop Back to School
Theme URI: https://example.com/faten-shop-back-to-school
Author: Faten Shop
Description: قالب صفحة هبوط عربية لعودة المدارس، مُعد للتخصيص عبر Customizer وElementor.
Version: 1.0.0
Requires at least: 6.0
Requires PHP: 7.4
Text Domain: faten-shop-back-to-school
*/

/* «دفتر المدرسة المشمس»: orange campaign energy, cobalt anchors, paper-cut transitions, Arabic editorial typography. */
@import url('https://fonts.googleapis.com/css2?family=Alexandria:wght@400;500;600;700;800&family=Tajawal:wght@400;500;700;800&display=swap');

:root { --faten-orange:#ff6a00; --faten-orange-deep:#e95000; --faten-blue:#155eef; --faten-ink:#111a36; --faten-cream:#fff9f1; --faten-paper:#fffdf9; --faten-mint:#b6f1cf; --faten-lavender:#c8b8ff; --faten-line:rgba(17,26,54,.12); --faten-display:'Alexandria',sans-serif; --faten-body:'Tajawal',sans-serif; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; background:var(--faten-cream); }
body { margin:0; color:var(--faten-ink); background:var(--faten-cream); font-family:var(--faten-body); }
a { color:inherit; text-decoration:none; }
img { max-width:100%; height:auto; }

.faten-page { min-width:320px; overflow:hidden; background:var(--faten-cream); }
.faten-topline { min-height:38px; display:flex; align-items:center; justify-content:center; gap:11px; padding:8px 18px; background:var(--faten-ink); color:#fff; font-size:12px; font-weight:700; }
.topline-dot { width:5px; height:5px; border-radius:50%; background:var(--faten-mint); }
.faten-hero { position:relative; isolation:isolate; min-height:660px; padding:24px clamp(24px,6vw,100px) 92px; color:#fff; background-color:var(--faten-orange); background-size:cover; background-position:center; }
.faten-hero:before { position:absolute; z-index:-1; inset:0; content:''; opacity:.35; background-image:radial-gradient(circle at 43% 20%,rgba(255,255,255,.12) 0 1px,transparent 1px),radial-gradient(circle at 76% 57%,rgba(255,255,255,.11) 0 1px,transparent 1px); background-size:15px 15px,17px 17px; mix-blend-mode:soft-light; }
.faten-header { position:relative; z-index:2; display:flex; align-items:center; justify-content:space-between; gap:20px; max-width:1360px; margin:0 auto; }
.brand-lockup,.footer-brand { display:inline-flex; align-items:center; color:#fff; }
.brand-lockup { padding:4px 11px; border-radius:5px 16px 5px 13px; background:rgba(17,26,54,.84); box-shadow:3px 4px 0 rgba(255,255,255,.16); }
.brand-lockup .brand-mark { width:150px; height:76px; object-fit:contain; object-position:center; filter:drop-shadow(0 2px 0 rgba(0,0,0,.10)); }
.footer-brand .brand-mark { width:120px; height:63px; object-fit:contain; object-position:center; }
.header-link { display:inline-flex; align-items:center; gap:7px; padding-bottom:4px; border-bottom:1px solid rgba(255,255,255,.7); font-size:14px; font-weight:700; transition:transform 180ms cubic-bezier(.23,1,.32,1); }
.header-link:hover { transform:translateX(-3px); }
.faten-arrow { font-family:Arial,sans-serif; font-size:17px; line-height:1; }
.hero-content { position:relative; z-index:2; width:min(570px,100%); margin:clamp(72px,11vw,138px) 9% 0 auto; text-align:right; }
.hero-kicker,.section-eyebrow { display:flex; align-items:center; gap:8px; font-size:13px; font-weight:800; }
.hero-kicker { margin-bottom:16px; }
.hero-kicker i { width:34px; height:8px; border-radius:20px; background:var(--faten-mint); }
.hero-content h1 { margin:0; color:#fff; font-family:var(--faten-display); font-size:clamp(40px,5.3vw,78px); font-weight:800; line-height:1.2; letter-spacing:-.055em; text-shadow:0 3px 0 rgba(132,43,0,.12); }
.hero-content>p { width:min(445px,100%); margin:24px 0 29px auto; font-size:clamp(17px,1.75vw,21px); font-weight:500; line-height:1.8; }
.faten-cta { display:inline-flex; align-items:center; justify-content:center; gap:13px; padding:17px 23px; border-radius:6px 15px 8px 14px; font-family:var(--faten-display); font-size:15px; font-weight:800; box-shadow:5px 6px 0 rgba(17,26,54,.20); transition:transform 170ms cubic-bezier(.23,1,.32,1),box-shadow 170ms cubic-bezier(.23,1,.32,1); }
.faten-cta:hover { transform:translate(-2px,-3px) rotate(-.35deg); box-shadow:8px 10px 0 rgba(17,26,54,.18); }
.faten-cta:active { transform:translate(2px,3px); box-shadow:2px 2px 0 rgba(17,26,54,.18); }
.faten-cta--light { color:var(--faten-ink); background:#fff; }
.faten-cta--dark { color:#fff; background:var(--faten-ink); }
.cta-note { display:flex; align-items:center; justify-content:flex-start; gap:6px; margin:19px 0 0; color:rgba(255,255,255,.88); font-size:12px; font-weight:600; }
.check-dot { display:grid; width:15px; height:15px; place-items:center; border-radius:50%; color:var(--faten-orange-deep); background:var(--faten-mint); font-size:10px; }
.hero-sticker { position:absolute; z-index:2; padding:9px 13px; color:var(--faten-ink); background:var(--faten-mint); font-family:var(--faten-display); font-size:12px; font-weight:800; box-shadow:4px 5px 0 rgba(17,26,54,.18); transform:rotate(-7deg); }
.sticker-one { top:27%; right:clamp(14px,2.8vw,52px); border-radius:50% 47% 42% 50%; }
.sticker-two { bottom:112px; left:clamp(18px,8vw,160px); border-radius:4px 12px 4px 12px; background:var(--faten-lavender); transform:rotate(5deg); }
.paper-cut { position:absolute; z-index:1; bottom:-1px; left:-5%; width:110%; height:71px; background:var(--faten-cream); clip-path:polygon(0 74%,6% 65%,14% 77%,22% 61%,31% 75%,40% 54%,50% 72%,58% 58%,66% 77%,75% 54%,84% 70%,92% 53%,100% 70%,100% 100%,0 100%); }
.faten-benefits { position:relative; z-index:3; width:min(1180px,calc(100% - 40px)); margin:-24px auto 0; padding:32px 37px; background:var(--faten-paper); border-radius:16px 37px 16px 29px; box-shadow:0 20px 45px rgba(39,31,21,.10); }
.section-eyebrow { margin:0 0 17px; color:var(--faten-orange-deep); }
.section-eyebrow:before { width:24px; height:3px; content:''; background:currentColor; }
.section-eyebrow--blue { color:var(--faten-blue); }
.benefits-row { display:grid; grid-template-columns:repeat(3,1fr); gap:22px; }
.benefit { display:flex; align-items:center; gap:13px; padding-left:22px; border-left:1px solid var(--faten-line); }
.benefit:last-child { padding-left:0; border-left:0; }
.benefit-icon { display:grid; width:46px; height:46px; flex:0 0 auto; place-items:center; border-radius:14px 6px 14px 8px; color:var(--faten-blue); background:#e9efff; font-size:20px; font-weight:800; }
.benefit h2 { margin:0 0 2px; font-family:var(--faten-display); font-size:16px; font-weight:800; }
.benefit p { margin:0; color:#596177; font-size:13px; line-height:1.55; }
.faten-offer { display:grid; width:min(1180px,calc(100% - 40px)); grid-template-columns:1fr .88fr; align-items:center; gap:clamp(32px,7vw,104px); margin:128px auto 110px; }
.offer-copy h2 { margin:0; font-family:var(--faten-display); font-size:clamp(29px,3.5vw,48px); line-height:1.42; letter-spacing:-.04em; }
.offer-copy h2 em { color:var(--faten-orange-deep); font-style:normal; }
.offer-paragraph { max-width:540px; margin:22px 0 30px; color:#596177; font-size:17px; line-height:1.8; }
.offer-visual { position:relative; }
.offer-visual:before { position:absolute; z-index:-1; top:-25px; right:-28px; width:63%; height:63%; border-radius:60% 37% 46% 39%; content:''; background:var(--faten-mint); }
.offer-visual img { display:block; width:100%; aspect-ratio:4/3; object-fit:cover; border-radius:70px 14px 48px 18px; box-shadow:15px 17px 0 var(--faten-blue); }
.scribble { position:absolute; display:grid; place-items:center; color:var(--faten-ink); background:var(--faten-lavender); box-shadow:3px 4px 0 rgba(17,26,54,.18); font-family:var(--faten-display); font-weight:800; }
.scribble-a { top:30%; left:-17px; width:42px; height:42px; border-radius:50%; }
.scribble-b { right:22%; bottom:-26px; width:51px; height:51px; border-radius:9px 19px 9px 19px; transform:rotate(-7deg); }
.financing-strip { display:flex; width:min(1180px,calc(100% - 40px)); align-items:center; justify-content:space-between; gap:25px; margin:0 auto 116px; padding:27px 31px; color:var(--faten-ink); border:1px solid rgba(21,94,239,.12); border-radius:12px 31px 12px 31px; background:#fff; box-shadow:0 15px 38px rgba(38,53,102,.08); }
.finance-copy { display:flex; align-items:center; gap:19px; }
.finance-icon { display:grid; width:53px; height:53px; flex:0 0 auto; place-items:center; border-radius:17px 6px 17px 6px; color:#fff; background:var(--faten-blue); font-size:24px; }
.finance-copy .section-eyebrow { margin-bottom:5px; font-size:11px; }
.finance-copy h2 { margin:0 0 3px; font-family:var(--faten-display); font-size:22px; letter-spacing:-.03em; }
.finance-copy p:last-child { margin:0; color:#596177; font-size:14px; }
.text-action { display:inline-flex; align-items:center; gap:7px; flex:0 0 auto; padding-bottom:4px; border-bottom:2px solid rgba(21,94,239,.25); color:var(--faten-blue); font-family:var(--faten-display); font-size:14px; font-weight:800; }
.closing-cta { position:relative; z-index:0; isolation:isolate; width:min(1300px,calc(100% - 40px)); overflow:hidden; margin:0 auto 40px; padding:clamp(54px,8vw,98px) 25px; border-radius:56px 18px 55px 17px; color:#fff; background:var(--faten-blue); text-align:center; }
.closing-cta:before { position:absolute; z-index:-1; inset:0; content:''; opacity:.14; background-image:linear-gradient(45deg,transparent 46%,#fff 47% 52%,transparent 53%); background-size:28px 28px; }
.closing-cta .section-eyebrow { justify-content:center; color:var(--faten-mint); }
.closing-cta h2 { margin:0 0 29px; font-family:var(--faten-display); font-size:clamp(35px,4.8vw,64px); font-weight:800; line-height:1.25; letter-spacing:-.045em; }
.closing-orb { position:absolute; z-index:-1; border-radius:50%; }
.orb-a { top:-77px; right:-77px; width:220px; height:220px; background:var(--faten-lavender); opacity:.9; }
.orb-b { bottom:-73px; left:11%; width:155px; height:155px; background:var(--faten-mint); }
.faten-footer { display:grid; width:min(1180px,calc(100% - 40px)); grid-template-columns:1fr auto 1fr; align-items:center; gap:20px; margin:0 auto; padding:25px 0 35px; color:var(--faten-ink); }
.footer-brand { color:var(--faten-ink); }
.faten-footer>p { margin:0; color:#747a8a; font-size:13px; text-align:center; }
.faten-footer nav { display:flex; justify-content:flex-end; gap:20px; }
.faten-footer nav a { color:#424a61; font-size:13px; font-weight:700; transition:color 180ms ease; }
.faten-footer nav a:hover { color:var(--faten-orange-deep); }
.faten-static-content { width:min(900px,calc(100% - 40px)); min-height:50vh; margin:80px auto; padding:35px; border-radius:16px; background:#fff; box-shadow:0 12px 30px rgba(39,31,21,.08); }
.faten-static-content h1 { margin-top:0; font-family:var(--faten-display); }
.faten-elementor-content { min-height:60vh; }
@media (prefers-reduced-motion:no-preference) { .hero-content { animation:faten-rise .62s cubic-bezier(.23,1,.32,1) both; } .hero-sticker { animation:faten-bob 4.2s ease-in-out infinite alternate; } .sticker-two { animation-delay:.7s; } }
@keyframes faten-rise { from { opacity:0; transform:translateY(16px); } to { opacity:1; transform:translateY(0); } }
@keyframes faten-bob { from { translate:0 0; } to { translate:0 -8px; } }
@media (max-width:760px) { .faten-topline { font-size:10px; } .faten-hero { min-height:610px; padding:18px 22px 82px; background-position:50% center; } .faten-header { align-items:flex-start; } .header-link { font-size:12px; } .hero-content { width:86%; margin:116px 0 0; } .hero-content h1 { font-size:clamp(38px,10.8vw,54px); } .hero-content>p { margin-top:18px; font-size:16px; } .sticker-one { top:150px; } .sticker-two { bottom:93px; left:18px; } .faten-benefits { width:calc(100% - 28px); margin-top:-16px; padding:25px 19px; } .benefits-row { grid-template-columns:1fr; gap:14px; } .benefit,.benefit:last-child { padding:0 0 14px; border-bottom:1px solid var(--faten-line); border-left:0; } .benefit:last-child { padding-bottom:0; border-bottom:0; } .faten-offer { width:calc(100% - 40px); grid-template-columns:1fr; gap:50px; margin:76px auto 80px; } .offer-copy h2 { font-size:31px; } .offer-paragraph { font-size:16px; } .offer-visual { width:90%; margin-inline:auto; } .financing-strip { width:calc(100% - 40px); flex-direction:column; align-items:flex-start; margin-bottom:80px; padding:25px 20px; } .finance-copy { align-items:flex-start; } .finance-copy p:last-child { line-height:1.6; } .closing-cta { width:calc(100% - 28px); margin-bottom:27px; border-radius:36px 14px 36px 14px; } .faten-footer { grid-template-columns:1fr; justify-items:center; gap:14px; padding-bottom:28px; } .faten-footer nav { flex-wrap:wrap; justify-content:center; gap:11px 18px; } }

/* Campaign-wide notebook treatment: every major section keeps the school-prep world tangible. */
.brand-lockup,.footer-brand { position:relative; }.faten-benefits { overflow:hidden; border:1px solid rgba(17,26,54,.08); background-color:var(--faten-paper); background-image:repeating-linear-gradient(to bottom,transparent 0 34px,rgba(21,94,239,.10) 35px 36px); box-shadow:8px 10px 0 rgba(255,106,0,.12); }.faten-benefits:before { position:absolute; top:-1px; right:32px; width:88px; height:25px; content:''; background:var(--faten-lavender); clip-path:polygon(0 6%,100% 0,94% 100%,6% 92%); opacity:.82; }.section-eyebrow>span { margin-right:5px; padding:4px 8px; border-radius:3px 8px 3px 8px; color:var(--faten-ink); background:var(--faten-mint); font-size:10px; transform:rotate(-2deg); }.section-eyebrow--blue>span { color:#fff; background:var(--faten-blue); }.benefit { position:relative; padding:9px 0 10px 22px; background:rgba(255,253,249,.52); }.benefit:after { position:absolute; right:0; bottom:0; left:0; height:4px; content:''; background:linear-gradient(90deg,var(--faten-mint) 0 18%,transparent 18% 23%,var(--faten-lavender) 23% 48%,transparent 48% 53%,#ffc58c 53% 74%,transparent 74%); opacity:.75; }.faten-offer { position:relative; padding:39px 0 33px; background-image:repeating-linear-gradient(to bottom,transparent 0 40px,rgba(21,94,239,.075) 41px 42px); }.faten-offer:after { position:absolute; z-index:-1; top:3px; right:-7vw; left:34%; height:99%; border-radius:4px 40px 35px 5px; content:''; background:#fffdf9; box-shadow:-9px 9px 0 rgba(255,106,0,.08); transform:rotate(-.6deg); }.offer-copy { position:relative; }.offer-copy:before { position:absolute; top:-27px; right:0; width:72px; height:14px; content:''; background:#ffc58c; clip-path:polygon(0 8%,100% 0,92% 100%,5% 91%); transform:rotate(2deg); }.offer-visual:after { position:absolute; right:-12px; bottom:-15px; width:100px; height:25px; content:''; background:var(--faten-mint); clip-path:polygon(0 8%,100% 0,95% 96%,5% 100%); transform:rotate(-5deg); }.financing-strip { position:relative; overflow:visible; border:0; border-radius:4px 17px 5px 21px; color:var(--faten-ink); background-color:#fffdf9; background-image:repeating-linear-gradient(to bottom,transparent 0 27px,rgba(21,94,239,.10) 28px 29px); box-shadow:9px 10px 0 rgba(255,106,0,.15); transform:rotate(.35deg); }.financing-strip:before { position:absolute; top:-12px; left:12%; width:124px; height:24px; content:''; background:#ffc58c; clip-path:polygon(0 8%,100% 0,94% 100%,5% 92%); transform:rotate(-2deg); }.finance-icon { border-radius:7px 16px 7px 16px; background:var(--faten-orange); box-shadow:3px 3px 0 var(--faten-ink); }.finance-copy .section-eyebrow { color:var(--faten-orange-deep); }.text-action { border-color:rgba(233,80,0,.3); color:var(--faten-orange-deep); }.closing-cta { border-radius:12px 49px 14px 42px; background:var(--faten-orange); box-shadow:12px 12px 0 rgba(17,26,54,.14); }.closing-cta:before { opacity:.16; background-image:linear-gradient(45deg,transparent 46%,#fff 47% 52%,transparent 53%); }.closing-cta:after { position:absolute; z-index:-1; top:-20px; bottom:-20px; left:13%; width:14px; content:''; background:var(--faten-blue); transform:rotate(16deg); opacity:.9; }.closing-cta .section-eyebrow { color:var(--faten-mint); }.closing-orb { background:var(--faten-blue); opacity:.9; }.orb-b { background:var(--faten-lavender); }@media (max-width:760px) { .faten-offer:after { right:-20px; left:20px; }.faten-offer { padding-top:34px; }.financing-strip { transform:none; }.faten-benefits:before { right:12px; } }