/* EasyOrder Coloring Book Landing */
.eocb{--cream:#fbf6ea;--gold:#f5c842;--gold-deep:#e6a82e;--coral:#e8603a;--coral-deep:#c84a26;--teal:#1b8c72;--ink:#2c211a;--muted:#7a6a5c;--card:#fff;--border:#ecd9b3;--radius:1rem;--shadow-soft:0 14px 40px -18px rgba(44,33,26,.3);--shadow-pop:0 22px 50px -22px rgba(232,96,58,.55);direction:rtl;font-family:"Tajawal","Cairo",system-ui,sans-serif;color:var(--ink);background:var(--cream);background-image:radial-gradient(circle at 15% 8%,rgba(245,200,66,.22) 0,transparent 35%),radial-gradient(circle at 88% 18%,rgba(232,96,58,.18) 0,transparent 38%),radial-gradient(circle at 70% 90%,rgba(27,140,114,.16) 0,transparent 40%);background-attachment:fixed;overflow-x:hidden;line-height:1.6}
.eocb *,.eocb *::before,.eocb *::after{box-sizing:border-box}
.eocb h1,.eocb h2,.eocb h3,.eocb h4{font-family:"Cairo","Tajawal",sans-serif;font-weight:800;letter-spacing:-.01em;margin:0;color:var(--ink)}
.eocb p,.eocb ul{margin:0}
.eocb img{max-width:100%;display:block}
.eocb-wrap{max-width:1100px;margin:0 auto;padding:0 20px}
.eocb-btn{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;padding:1rem 1.75rem;border-radius:9999px;background:linear-gradient(135deg,var(--coral),var(--coral-deep));color:#fff;font-weight:800;font-size:1.05rem;box-shadow:var(--shadow-pop);border:0;cursor:pointer;text-decoration:none;transition:.2s}
.eocb-btn:hover{transform:translateY(-2px) scale(1.02);filter:brightness(1.05)}
.eocb-btn-full{width:100%}
.eocb-chip{display:inline-flex;align-items:center;gap:.4rem;padding:.4rem .9rem;border-radius:9999px;background:#fbe9b9;color:var(--ink);font-weight:700;font-size:.85rem;border:1px dashed rgba(232,96,58,.5)}
.eocb-chip-coral{background:var(--coral);color:#fff;border-color:transparent}
.eocb-chip-ink{background:var(--ink);color:var(--cream);border-color:transparent}
.eocb-card{background:var(--card);border-radius:1.85rem;box-shadow:var(--shadow-soft);border:1px solid var(--border);overflow:hidden}
/* hero */
.eocb-hero{position:relative;padding:40px 0 80px}
@media(min-width:768px){.eocb-hero{padding:64px 0 112px}}
.eocb-doodle{position:absolute;font-size:34px;opacity:.6;animation:eocb-float 6s ease-in-out infinite}
.eocb-doodle.d1{top:48px;left:24px}
.eocb-doodle.d2{top:128px;right:32px;animation-delay:1s}
.eocb-doodle.d3{bottom:40px;left:64px;animation-delay:1.5s}
@keyframes eocb-float{0%,100%{transform:translateY(0)}50%{transform:translateY(-10px)}}
.eocb-hero-grid{display:grid;gap:48px;align-items:center}
@media(min-width:768px){.eocb-hero-grid{grid-template-columns:1fr 1fr}}
.eocb-hero-text{text-align:center}
@media(min-width:768px){.eocb-hero-text{text-align:right}}
.eocb-hero-text h1{margin-top:20px;font-size:clamp(2rem,5vw,3.5rem);line-height:1.15}
.eocb-hl{position:relative;display:inline-block}
.eocb-hl::after{content:"";position:absolute;left:0;right:0;bottom:4px;height:12px;background:var(--gold);border-radius:9999px;opacity:.7;z-index:-1}
.eocb-coral{color:var(--coral)}
.eocb-lead{margin-top:20px;font-size:1.1rem;color:var(--muted);max-width:560px}
@media(max-width:767px){.eocb-lead{margin-left:auto;margin-right:auto}}
.eocb-trust{margin-top:32px;display:flex;flex-wrap:wrap;gap:24px;justify-content:center}
@media(min-width:768px){.eocb-trust{justify-content:flex-start}}
.eocb-trust-item{display:flex;align-items:center;gap:8px;font-weight:800}
.eocb-avatars{display:flex}
.eocb-avatars span{display:grid;place-items:center;width:36px;height:36px;border-radius:50%;background:var(--gold);border:2px solid var(--cream);font-size:18px;margin-left:-8px}
.eocb-stars{color:var(--gold-deep);letter-spacing:2px}
.eocb-hero-visual{position:relative}
.eocb-hero-img{aspect-ratio:4/5;border-radius:1.85rem;overflow:hidden}
.eocb-hero-img img{width:100%;height:100%;object-fit:cover}
.eocb-hero-img:first-child{transform:rotate(2deg)}
.eocb-hero-side1{position:absolute;bottom:-24px;right:-16px;width:40%;aspect-ratio:1;transform:rotate(-6deg)}
.eocb-hero-side2{position:absolute;top:-20px;left:-12px;width:33%;aspect-ratio:1;transform:rotate(8deg)}
@media(max-width:640px){.eocb-hero-side1,.eocb-hero-side2{display:none}}
.eocb-shipchip{position:absolute;bottom:-12px;left:50%;transform:translateX(-50%)}
/* sections */
.eocb-section{padding:64px 0}
@media(min-width:768px){.eocb-section{padding:96px 0}}
.eocb-bg-coral{background:rgba(232,96,58,.08)}
.eocb-bg-teal{background:rgba(27,140,114,.1)}
.eocb-bg-gold{background:rgba(245,200,66,.12)}
.eocb-head{text-align:center;max-width:720px;margin:0 auto 48px}
.eocb-head h2{margin-top:12px;font-size:clamp(1.8rem,4vw,3rem)}
.eocb-head p{margin-top:12px;color:var(--muted)}
/* concept */
.eocb-concept{display:grid;gap:32px}
@media(min-width:768px){.eocb-concept{grid-template-columns:1fr 1fr}}
.eocb-concept figure{margin:0}
.eocb-concept .eocb-card{position:relative}
.eocb-concept-chip{position:absolute;top:16px;right:16px}
.eocb-concept figcaption{margin-top:16px;text-align:center;font-weight:800}
/* scenes */
.eocb-scenes{display:grid;grid-template-columns:repeat(2,1fr);gap:16px}
@media(min-width:768px){.eocb-scenes{grid-template-columns:repeat(3,1fr)}}
@media(min-width:1024px){.eocb-scenes{grid-template-columns:repeat(4,1fr)}}
.eocb-scene{margin:0}
.eocb-scene-img{aspect-ratio:3/4;overflow:hidden;background:#eee}
.eocb-scene-img img{width:100%;height:100%;object-fit:cover;transition:transform .5s}
.eocb-scene:hover .eocb-scene-img img{transform:scale(1.05)}
.eocb-scene figcaption{padding:12px;text-align:center;font-weight:800}
/* values */
.eocb-values{display:grid;gap:20px}
@media(min-width:640px){.eocb-values{grid-template-columns:repeat(2,1fr)}}
@media(min-width:1024px){.eocb-values{grid-template-columns:repeat(4,1fr)}}
.eocb-value{padding:24px}
.eocb-vicon{display:grid;place-items:center;width:56px;height:56px;border-radius:18px;background:var(--gold);font-size:26px}
.eocb-value h3{margin-top:16px;font-size:1.25rem}
.eocb-value p{margin-top:4px;color:var(--muted)}
/* steps */
.eocb-steps{display:grid;gap:20px}
@media(min-width:768px){.eocb-steps{grid-template-columns:repeat(4,1fr)}}
.eocb-step{padding:24px;text-align:center;position:relative}
.eocb-step-icon{position:relative;margin:0 auto;display:grid;place-items:center;width:64px;height:64px;border-radius:18px;background:var(--coral);color:#fff;font-size:28px;box-shadow:var(--shadow-pop)}
.eocb-step-n{position:absolute;top:-8px;right:-8px;display:grid;place-items:center;width:28px;height:28px;border-radius:50%;background:var(--ink);color:var(--cream);font-size:12px;font-weight:800}
.eocb-step h3{margin-top:16px;font-size:1.2rem}
.eocb-step p{margin-top:8px;font-size:.9rem;color:var(--muted)}
/* order */
.eocb-order-grid{display:grid;gap:32px;align-items:stretch}
@media(min-width:768px){.eocb-order-grid{grid-template-columns:1fr 1fr}}
.eocb-order-info,.eocb-form{padding:28px;position:relative}
@media(min-width:768px){.eocb-order-info,.eocb-form{padding:36px}}
.eocb-info-tag{position:absolute;top:-12px;left:-12px}
.eocb-info-sub{font-size:.85rem;font-weight:800;color:var(--coral)}
.eocb-order-info h3{margin-top:4px;font-size:1.85rem}
.eocb-price{margin-top:16px;display:flex;align-items:flex-end;gap:8px}
.eocb-price-num{font-size:3rem;font-weight:800}
.eocb-price-cur{font-size:1.25rem;color:var(--muted);margin-bottom:4px}
.eocb-price-old{margin-right:auto;font-size:.9rem;color:var(--muted);text-decoration:line-through}
.eocb-price-note{margin-top:8px;font-size:.9rem;color:var(--muted)}
.eocb-features{margin-top:24px;padding:0;list-style:none;display:grid;gap:12px}
.eocb-features li{display:flex;align-items:center;gap:8px}
.eocb-check{display:grid;place-items:center;width:24px;height:24px;border-radius:50%;background:var(--teal);color:#fff;font-size:12px}
.eocb-cod{margin-top:24px;font-size:.9rem;color:var(--muted)}
.eocb-form h3{font-size:1.5rem}
.eocb-form-sub{margin-top:4px;font-size:.9rem;color:var(--muted)}
.eocb-fields{margin-top:20px;display:grid;gap:16px}
.eocb-fields label{display:block}
.eocb-fields label>span,.eocb-flabel{font-size:.85rem;font-weight:700;color:var(--ink)}
.eocb-fhint{margin-top:4px;font-size:.75rem;color:var(--muted)}
.eocb-fields input,.eocb-fields select{margin-top:4px;width:100%;border-radius:1rem;border:1px solid var(--border);background:#fff;padding:12px 16px;color:var(--ink);font-family:inherit;font-size:1rem}
.eocb-fields input:focus,.eocb-fields select:focus{outline:0;box-shadow:0 0 0 2px var(--coral)}
.eocb-deposit{margin-top:8px;display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.eocb-dep{position:relative;cursor:pointer;border-radius:1rem;border:2px solid var(--border);background:#fff;padding:12px;text-align:center;transition:.2s}
.eocb-dep:hover{border-color:var(--coral)}
.eocb-dep input{position:absolute;opacity:0;pointer-events:none}
.eocb-dep:has(input:checked){border-color:var(--coral);background:rgba(232,96,58,.12)}
.eocb-dep-num{display:block;font-size:1.15rem;font-weight:800}
.eocb-dep-cur{display:block;font-size:.75rem;color:var(--muted)}
.eocb-center{text-align:center}
.eocb-success{margin-top:24px;padding:20px;border-radius:1rem;background:rgba(27,140,114,.18);border:1px solid var(--teal);text-align:center}
.eocb-emo{font-size:1.5rem}
.eocb-success-msg{margin-top:8px;font-weight:800}
/* faq */
.eocb-faq-wrap{max-width:760px}
.eocb-faqs{display:grid;gap:12px}
.eocb-faq{padding:0}
.eocb-faq summary{list-style:none;cursor:pointer;padding:20px;display:flex;align-items:center;justify-content:space-between;gap:16px}
.eocb-faq summary::-webkit-details-marker{display:none}
.eocb-faq summary>span:first-child{font-weight:800;font-size:1.05rem}
.eocb-faq-plus{display:grid;place-items:center;width:32px;height:32px;border-radius:50%;background:var(--gold);color:var(--ink);transition:transform .2s;font-size:18px;font-weight:800}
.eocb-faq[open] .eocb-faq-plus{transform:rotate(45deg)}
.eocb-faq-a{padding:0 20px 20px;color:var(--muted)}
/* footer */
.eocb-footer{background:var(--ink);color:var(--cream);padding:48px 0}
.eocb-foot-grid{display:grid;gap:32px}
@media(min-width:768px){.eocb-foot-grid{grid-template-columns:repeat(3,1fr)}}
.eocb-footer p{font-size:.9rem;opacity:.85;margin-top:8px}
.eocb-footer ul{list-style:none;padding:0;display:grid;gap:8px;font-size:.9rem;opacity:.9}
.eocb-foot-h{font-weight:800;margin-bottom:8px;opacity:1;font-size:1rem}
.eocb-social{display:flex;gap:12px}
.eocb-social a{display:grid;place-items:center;width:44px;height:44px;border-radius:14px;background:rgba(255,255,255,.1);font-size:20px;text-decoration:none;transition:.2s}
.eocb-social a:hover{background:var(--coral)}
.eocb-copy{margin-top:40px;padding-top:24px;border-top:1px solid rgba(255,255,255,.1);font-size:.85rem;opacity:.7;text-align:center}
/* sticky cta */
.eocb-sticky{position:fixed;bottom:12px;left:12px;right:12px;z-index:50}
@media(min-width:768px){.eocb-sticky{display:none}}

/* total block */
.eocb-total{margin-top:12px;padding:16px;border-radius:1rem;background:rgba(245,200,66,.18);border:1px dashed var(--gold-deep);display:grid;gap:8px}
.eocb-total-row{display:flex;align-items:center;justify-content:space-between;font-size:.95rem}
.eocb-total-row span{color:var(--muted)}
.eocb-total-row strong{color:var(--ink);font-weight:800}
.eocb-total-grand{padding-top:8px;border-top:1px dashed var(--border);font-size:1.1rem}
.eocb-total-grand span,.eocb-total-grand strong{color:var(--coral)}
.eocb-total-rest span,.eocb-total-rest strong{color:var(--teal)}