/*
Theme Name: Mashael Studio
Author: Mashael Studio
Description: تصميم عربي مخصص لخدمات التعليم، مع كتالوج خدمات وأسعار قابلة للإدارة والطلب عبر واتساب.
Version: 1.0.1
Requires at least: 6.0
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: mashael-studio
*/

:root{--ink:#263e38;--green:#365a4b;--cream:#f8f6ef;--line:#e1e5d9;--muted:#6d776d;--yellow:#ecd990}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:90px}body{margin:0;background:var(--cream);color:var(--ink);font-family:'IBM Plex Sans Arabic',Tahoma,sans-serif}button,input,select,textarea{font:inherit}button,a{transition:.2s}a{color:inherit;text-decoration:none}button{cursor:pointer}header{height:92px;display:flex;align-items:center;justify-content:space-between;max-width:1240px;margin:auto;padding:0 32px;border-bottom:1px solid var(--line)}.logo{font-size:36px;font-weight:700;letter-spacing:-2px}.logo small{font-size:11px;letter-spacing:2px;display:block;margin-top:-9px;font-weight:400}nav{display:flex;gap:30px;font-size:14px}.btn{border:1px solid var(--green);background:var(--green);color:white;padding:12px 25px;border-radius:7px;display:inline-flex;align-items:center;justify-content:center;gap:16px}.btn:hover{background:#244334;transform:translateY(-2px)}.outline{background:transparent;color:var(--ink)}.outline:hover{color:white}.wrap{max-width:1240px;margin:auto;padding:0 32px}.hero{display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:55px;padding-top:66px;padding-bottom:60px}.eyebrow{font-size:13px;letter-spacing:1px;display:flex;align-items:center;gap:10px}.eyebrow:before{content:'';width:7px;height:7px;border-radius:100%;background:#a2b290}h1{font-size:58px;line-height:1.4;letter-spacing:-2px;margin:18px 0}h1 em{font-style:normal;color:#799169;position:relative}p{line-height:1.9}.hero p{color:var(--muted);max-width:460px;font-size:17px}.actions{display:flex;gap:13px;margin:28px 0}.note{font-size:12px;color:var(--muted)}.art{height:460px;background:#e9eddf;border-radius:48% 48% 10px 10px;position:relative;display:flex;align-items:center;justify-content:center}.paper{width:245px;height:330px;background:#fffdf7;box-shadow:0 22px 40px #33462a20;border:1px solid #dedfce;padding:30px;text-align:center;transform:rotate(-8deg);position:relative}.paper:before{content:'';position:absolute;inset:12px;border:1px solid #b5c29f}.paper .sprig{font-size:52px;color:#8b9b72}.paper h2{font-size:30px;margin:14px 0 5px}.paper hr{width:40px;border:1px solid #adbc91}.paper p{font-size:13px}.tag{position:absolute;background:white;padding:12px 20px;border-radius:9px;box-shadow:0 8px 30px #273f3210;font-size:13px;z-index:2}.tag.one{right:0;top:82px;transform:rotate(4deg)}.tag.two{left:0;bottom:65px;transform:rotate(4deg)}.star{position:absolute;font-size:70px;color:#9dac84;top:15px;left:40px}.tiny-paper{position:absolute;width:170px;height:230px;background:var(--yellow);transform:rotate(11deg);left:65px;top:155px;border-radius:3px}.ribbon{border-top:1px solid var(--line);border-bottom:1px solid var(--line);display:flex;justify-content:space-around;padding:23px;gap:15px;font-size:14px}.ribbon span:before{content:'✧';margin-left:12px;color:#859569}section{padding:75px 0}.heading{display:flex;align-items:end;justify-content:space-between;gap:20px;margin-bottom:28px}h2{font-size:34px;line-height:1.4;margin:12px 0}.sub{color:var(--muted);font-size:14px;margin:0}.filters{display:flex;gap:9px;flex-wrap:wrap;margin:28px 0}.filter{background:transparent;border:1px solid #d8dece;border-radius:25px;padding:8px 21px;color:var(--ink)}.filter.active{background:var(--green);color:white;border-color:var(--green)}.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}.card{background:#fffef9;border:1px solid var(--line);border-radius:12px;overflow:hidden;display:flex;flex-direction:column}.cover{height:160px;display:flex;justify-content:center;align-items:center;background:#e9eddf;overflow:hidden;position:relative}.cover:nth-child(1){color:#53664b}.mini{width:98px;height:132px;background:#fffef9;transform:rotate(-8deg) translateY(19px);box-shadow:7px 8px 0 #bac5a0;display:flex;flex-direction:column;justify-content:center;text-align:center;border:1px solid #cdd4be;font-size:12px;padding:8px}.mini b{font-size:18px}.mini span{font-size:9px;margin-top:8px}.cover:before,.cover:after{content:'✧';position:absolute;font-size:35px;right:55px;top:35px;color:#a5b08a}.cover:after{right:auto;left:55px;top:85px;font-size:22px}.card:nth-child(3n+2) .cover{background:#f0e6d7}.card:nth-child(3n+2) .mini{box-shadow:7px 8px 0 #dbc9ac}.card:nth-child(3n) .cover{background:#e6e7ed}.card:nth-child(3n) .mini{box-shadow:7px 8px 0 #c3c4d4}.body{padding:23px;display:flex;flex:1;flex-direction:column}.category{font-size:11px;color:#78856c}.body h3{font-size:20px;margin:8px 0}.body p{font-size:13px;color:var(--muted);margin:0 0 20px;flex:1}.card-bottom{display:flex;justify-content:space-between;align-items:center;border-top:1px solid var(--line);padding-top:16px;font-size:12px}.order{border:0;background:#edf0e5;color:var(--green);padding:8px 15px;border-radius:5px}.order:hover{background:var(--green);color:white}.audience{display:flex;gap:12px;flex-wrap:wrap;margin-top:25px}.audience span{background:#fffdf7;border:1px solid var(--line);padding:13px 24px;border-radius:40px}.process{background:#eaf0e4}.steps{display:grid;grid-template-columns:repeat(4,1fr);gap:30px;margin-top:40px}.step b{font-size:35px;font-weight:400;color:#91a17a}.step h3{font-size:17px}.step p{font-size:13px;color:var(--muted)}.why{display:grid;grid-template-columns:1fr 1.4fr;gap:80px}.benefits{display:grid;grid-template-columns:1fr 1fr;gap:28px}.benefits h3{font-size:17px;margin:8px 0}.benefits p{font-size:13px;color:var(--muted);margin:0}.faq{max-width:850px;margin:auto}details{border-bottom:1px solid var(--line);padding:20px 0}summary{cursor:pointer;list-style:none;font-weight:500}summary:after{content:'+';float:left;font-size:22px;color:#849473}details[open] summary:after{content:'−'}details p{font-size:14px;color:var(--muted)}.cta{background:var(--green);color:#fff9ec;border-radius:16px;padding:45px;display:flex;align-items:center;justify-content:space-between;gap:25px;margin-bottom:65px}.cta .btn{background:var(--yellow);color:var(--ink);border:0}.cta p{color:#d4dfcc;margin-bottom:0}footer{border-top:1px solid var(--line);padding:38px 0 22px}.foot{display:flex;justify-content:space-between;gap:30px}.socials{display:flex;gap:20px;margin-top:18px}.bottom{border-top:1px solid var(--line);margin-top:30px;padding-top:20px;display:flex;justify-content:space-between;font-size:11px;color:var(--muted)}.text-btn{border:0;background:none;color:inherit;padding:0;text-decoration:underline}.float{position:fixed;bottom:24px;left:24px;box-shadow:0 5px 22px #203e3829;z-index:5}.float span{font-size:20px}dialog{border:1px solid var(--line);border-radius:15px;max-width:550px;width:calc(100% - 30px);padding:28px;background:var(--cream);color:var(--ink)}dialog::backdrop{background:#203b3280;backdrop-filter:blur(4px)}.close{float:left;border:0;background:transparent;font-size:25px}label{display:block;font-size:13px;margin:15px 0 6px}input,textarea,select{width:100%;border:1px solid #cdd5c3;background:#fffef8;border-radius:5px;padding:10px;color:var(--ink)}textarea{resize:vertical}#status{font-size:13px;color:var(--green)}.hidden{display:none!important}:focus-visible{outline:3px solid #bb9d41;outline-offset:4px}@media(max-width:800px){header{height:80px;padding:0 20px}nav{display:none}.wrap{padding:0 20px}.hero{grid-template-columns:1fr;gap:32px;padding-top:40px}h1{font-size:42px}.hero p{font-size:15px}.art{height:370px;max-width:500px;width:100%;margin:auto}.paper{height:280px;width:215px}.tiny-paper{left:35px;top:100px}.tag.one{right:-5px;top:55px}.tag.two{left:-5px;bottom:35px}.ribbon{flex-wrap:wrap;font-size:12px;justify-content:center}.grid{grid-template-columns:repeat(2,1fr)}.steps{grid-template-columns:1fr 1fr}.why{grid-template-columns:1fr;gap:25px}section{padding:50px 0}.heading{display:block}h2{font-size:29px}.cta{padding:28px;display:block}.cta .btn{margin-top:20px}.foot{display:block}.bottom{gap:20px}.float{padding:10px 16px;font-size:12px}.body{padding:16px}}@media(max-width:490px){.grid{grid-template-columns:1fr}.cover{height:170px}.benefits{gap:20px}.hero h1{font-size:39px}.art{margin-top:8px}.header-cta{font-size:12px;padding:10px 16px}.actions .btn{padding:12px 17px;font-size:13px}}

/* Refined service covers: service name only. */
.card{border-radius:10px;border-color:#e4e5dd;box-shadow:0 3px 16px #253d3503}
.cover{height:230px;background:#e8ece2;color:#354e40}
.cover:before,.cover:after{display:none}
.card:nth-child(3n+2) .cover{background:#efe9df;color:#675542}
.card:nth-child(3n) .cover{background:#e9e8ed;color:#514f64}
.service-art{width:100%;height:100%;position:relative;display:grid;place-items:center;background:radial-gradient(ellipse at 25% 0%,#ffffff80,transparent 70%)}
.service-art:before{content:'';position:absolute;width:158px;height:190px;background:#ffffff70;border:1px solid #ffffff80;transform:rotate(8deg) translate(9px,7px);box-shadow:0 10px 20px #30402e09}
.service-sheet{position:relative;width:158px;height:190px;background:#fffdf7;border:1px solid #d8d8c8;box-shadow:0 12px 25px #35413218;display:flex;flex-direction:column;justify-content:center;align-items:center;padding:28px 20px;transform:rotate(-5deg)}
.service-sheet:before{content:'';position:absolute;inset:10px;border:1px solid currentColor;opacity:.18;pointer-events:none}
.service-sheet b{font-size:23px;font-weight:500;line-height:1.65;text-align:center;max-width:120px;position:relative}
.service-symbol{width:25px;height:25px;border:1px solid currentColor;border-radius:50% 50% 0 50%;transform:rotate(45deg);opacity:.45;margin-bottom:17px}
.service-symbol:after{content:'';display:block;position:absolute;inset:6px;border:1px solid currentColor;border-radius:50% 50% 0 50%}
.service-rule{height:1px;width:30px;background:currentColor;opacity:.4;margin-top:18px}
.body{padding:25px}.body h3{font-size:20px;line-height:1.6;margin:9px 0}.body p{line-height:1.9}.card-bottom{padding-top:18px}.grid{gap:25px}
@media(max-width:800px){.cover{height:220px}.body{padding:20px}}
@media(max-width:490px){.cover{height:240px}.service-sheet,.service-art:before{width:170px;height:198px}}

.logo{display:inline-flex;align-items:baseline;flex-wrap:wrap;column-gap:7px;width:134px;line-height:1.1;letter-spacing:-1px}
.logo .brand-ar{display:inline;font-size:17px;font-weight:500;letter-spacing:0;margin:0}
.logo .brand-en{display:block;flex-basis:100%;font-size:10px;letter-spacing:1.1px;font-weight:400;margin-top:8px;text-align:center}
.paper{display:flex;flex-direction:column;justify-content:center;align-items:center;padding:35px 25px}
.paper h2{margin:20px 0 12px;font-size:32px}.paper p{font-size:13px;margin:10px 0}.paper hr{margin:8px auto}
.service-sheet b{font-size:24px}.service-rule{margin-top:23px}.tag{font-size:12px}
@media(max-width:490px){.logo{width:123px;font-size:34px}.logo .brand-ar{font-size:16px}.logo .brand-en{font-size:9px}.paper h2{font-size:29px}}

.logo{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:0;width:140px;line-height:1.05;letter-spacing:0}
.logo .brand-ar{font-size:14px;line-height:1.3;font-weight:500;margin:0 0 1px;letter-spacing:0}
.logo .brand-name{font-size:36px;line-height:1.15;font-weight:700;letter-spacing:-1.5px}
.logo .brand-en{flex-basis:auto;font-size:9px;letter-spacing:1.1px;margin-top:5px;line-height:1.3;font-weight:400}
header{height:106px}.art{padding-bottom:45px}
.art-caption{position:absolute;bottom:0;left:0;right:0;min-height:58px;padding:17px 20px;display:flex;justify-content:center;align-items:center;gap:19px;background:#e1e7d8;border-top:1px solid #cdd6c0;border-radius:0 0 10px 10px;color:#4e624b;font-size:12px;line-height:1.8}
.art-caption i{width:1px;height:16px;background:#a7b399;flex:none}
@media(max-width:800px){header{height:98px}.logo{width:123px}.logo .brand-name{font-size:33px}.logo .brand-ar{font-size:13px}.logo .brand-en{font-size:8px}.art-caption{gap:13px;padding:14px 10px;font-size:11px;min-height:52px}.art{padding-bottom:35px}}

.logo{align-items:stretch;width:140px;text-align:right}
.logo .brand-ar{align-self:flex-start;text-align:right}
.logo .brand-name{align-self:center}
.logo .brand-en{align-self:flex-end;text-align:left;white-space:nowrap}
.whatsapp-icon{width:21px;height:21px;flex-shrink:0;display:block}
@media(max-width:800px){.logo{width:123px}.whatsapp-icon{width:20px;height:20px}}

html[lang]{margin-top:0}body.admin-bar header{margin-top:32px}.skip-link{position:absolute;top:-200px;right:15px;background:white;padding:12px;z-index:100000}.skip-link:focus{top:40px}.service-cover-image{width:100%;height:100%;object-fit:cover}.wp-content{max-width:900px;margin:60px auto;padding:24px;min-height:45vh}.wp-content a{text-decoration:underline}.wp-content img{max-width:100%;height:auto}.wp-content input[type=submit]{width:auto}.empty-catalog{grid-column:1/-1;padding:35px;border:1px solid var(--line);border-radius:8px}header .logo{width:115px}

@media(max-width:782px){body.admin-bar header{margin-top:46px}}
