/* Tamiyouz Phase 12 — Interactive Services Showcase (Home only)
   Preserves all six real links and bilingual text, adds depth and feedback. */
#tyz-home-v21 .tyz-services{
 position:relative;isolation:isolate;
 background:
 radial-gradient(ellipse 47% 75% at 4% 14%,rgba(193,145,66,.085),transparent 69%),
 linear-gradient(112deg,#fffefa 2%,#f7f6f2 53%,#fcfaf6)!important;
}
html[data-tyz-theme="dark"] #tyz-home-v21 .tyz-services{
 background:
 radial-gradient(ellipse 52% 70% at 7% 20%,rgba(224,154,63,.11),transparent 72%),
 linear-gradient(120deg,#0d1828,#111e30 62%,#0c1727)!important;
}
#tyz-home-v21 .tyz-services .tyz-section-head{position:relative;z-index:1}
#tyz-home-v21 .tyz-services .tyz-section-head h2{
 text-wrap:balance;
}
#tyz-home-v21 .tyz-service-grid{
 position:relative;z-index:1;gap:clamp(14px,1.65vw,23px);
}
#tyz-home-v21 .tyz-services .tyz-service{
 --tyz-svc-x:50%;--tyz-svc-y:48%;
 position:relative;isolation:isolate;
 border-radius:24px!important;
 min-height:clamp(295px,23.4vw,352px);
 padding:clamp(24px,2.15vw,33px)!important;
 overflow:hidden;
 background:
 linear-gradient(138deg,rgba(255,255,255,.76),rgba(252,249,243,.93))!important;
 border:1px solid rgba(150,112,61,.19)!important;
 box-shadow:0 16px 37px rgba(46,50,57,.055),inset 0 1px 0 rgba(255,255,255,.76)!important;
 transition:
 transform .48s cubic-bezier(.22,1,.36,1),
 box-shadow .45s cubic-bezier(.22,1,.36,1),
 border-color .45s cubic-bezier(.22,1,.36,1)!important;
}
html[data-tyz-theme="dark"] #tyz-home-v21 .tyz-services .tyz-service{
 background:linear-gradient(141deg,#17283f,#111e32 70%,#101c30)!important;
 border-color:rgba(229,177,106,.18)!important;
 box-shadow:0 16px 39px rgba(0,0,0,.14),inset 0 1px 0 rgba(235,204,149,.035)!important;
}
#tyz-home-v21 .tyz-services .tyz-service::before{
 content:"";position:absolute;inset:0;pointer-events:none;z-index:0;
 background:radial-gradient(260px circle at var(--tyz-svc-x) var(--tyz-svc-y),
 rgba(223,166,87,.20),transparent 78%);
 opacity:.42;transition:opacity .4s ease;
}
#tyz-home-v21 .tyz-services .tyz-service::after{
 content:"";pointer-events:none;position:absolute;
 width:250px;height:250px;top:-152px;inset-inline-end:-126px;
 border:1px solid rgba(164,117,53,.23);border-radius:50%;
 box-shadow:0 0 0 38px rgba(181,123,61,.035),0 0 0 85px rgba(180,131,63,.017);
 transform:rotate(-26deg);
 opacity:.55;transition:opacity .4s,transform .8s cubic-bezier(.22,1,.36,1);
}
html[data-tyz-theme="dark"] #tyz-home-v21 .tyz-services .tyz-service::before{
 background:radial-gradient(290px circle at var(--tyz-svc-x) var(--tyz-svc-y),
 rgba(223,165,85,.16),transparent 77%);
}
#tyz-home-v21 .tyz-services .tyz-service:hover,
#tyz-home-v21 .tyz-services .tyz-service:focus-within{
 border-color:rgba(169,119,46,.48)!important;
 box-shadow:0 32px 62px rgba(28,43,57,.11),0 0 0 1px rgba(214,167,91,.09)!important;
 transform:translate3d(0,-7px,0)!important;
}
html[data-tyz-theme="dark"] #tyz-home-v21 .tyz-services .tyz-service:is(:hover,:focus-within){
 box-shadow:0 29px 67px rgba(2,10,24,.31),0 0 0 1px rgba(234,184,115,.085)!important;
}
#tyz-home-v21 .tyz-services .tyz-service:is(:hover,:focus-within)::before{opacity:1}
#tyz-home-v21 .tyz-services .tyz-service:is(:hover,:focus-within)::after{
 transform:rotate(22deg) scale(1.14);opacity:.85
}
#tyz-home-v21 .tyz-services .tyz-service > *{position:relative;z-index:2}
#tyz-home-v21 .tyz-services .tyz-service>span{
 font:800 11px/1.45 Arial,sans-serif;letter-spacing:.16em;
 color:#a2722f!important;
}
html[data-tyz-theme="dark"] #tyz-home-v21 .tyz-services .tyz-service>span{color:#e4bf83!important}
#tyz-home-v21 .tyz-services .tyz-service .tyz-service__icon{
 display:grid;place-items:center;
 width:57px!important;height:57px!important;margin:27px 0 21px!important;
 background:linear-gradient(133deg,rgba(246,224,188,.92),rgba(226,187,129,.37))!important;
 color:#9e6b2f!important;
 border:1px solid rgba(172,127,65,.28);
 border-radius:18px!important;
 box-shadow:0 12px 25px rgba(143,100,40,.085);
 overflow:visible;
 transition:transform .5s cubic-bezier(.22,1,.36,1),box-shadow .5s;
}
html[data-tyz-theme="dark"] #tyz-home-v21 .tyz-services .tyz-service .tyz-service__icon{
 background:linear-gradient(133deg,rgba(203,153,88,.18),rgba(197,134,51,.06))!important;
 border-color:rgba(239,191,126,.32)!important;color:#f3ce8c!important;
 box-shadow:0 12px 28px rgba(0,0,0,.19);
}
#tyz-home-v21 .tyz-services .tyz-service .tyz-service__icon::after{
 content:"";pointer-events:none;position:absolute;inset:-8px;
 border:1px solid rgba(173,116,39,.16);border-radius:22px;
 opacity:.65;transform:scale(.97);transition:transform .42s,opacity .42s;
}
#tyz-home-v21 .tyz-services .tyz-service:is(:hover,:focus-within) .tyz-service__icon{
 transform:translate3d(0,-3px,0) rotate(-4deg);
 box-shadow:0 18px 36px rgba(177,121,45,.16);
}
#tyz-home-v21 .tyz-services .tyz-service:is(:hover,:focus-within) .tyz-service__icon::after{
 transform:scale(1.08);opacity:1
}
#tyz-home-v21 .tyz-services .tyz-service .tyz-service__icon svg{
 width:28px!important;height:28px!important;stroke:currentColor!important;
}
#tyz-home-v21 .tyz-services .tyz-service h3{
 font-size:clamp(21px,1.65vw,26px)!important;
 line-height:1.5!important;
 letter-spacing:-.025em;
 color:#17283b!important;
 margin:0 0 11px!important;
}
html[data-tyz-theme="dark"] #tyz-home-v21 .tyz-services .tyz-service h3{
 color:#f6eee0!important;
}
#tyz-home-v21 .tyz-services .tyz-service p{
 font-size:13px!important;line-height:1.98!important;
 color:#5b6875!important;max-width:320px;
}
html[data-tyz-theme="dark"] #tyz-home-v21 .tyz-services .tyz-service p{
 color:#b4c1cd!important;
}
#tyz-home-v21 .tyz-services .tyz-service a{
 display:flex;align-items:center;justify-content:space-between;
 gap:9px;padding-top:19px!important;margin-top:auto;
 border-top:1px solid rgba(165,122,69,.15);
 color:#a16c2e!important;font-weight:900!important;font-size:12px!important;
 transition:color .28s,letter-spacing .28s;
}
html[data-tyz-theme="dark"] #tyz-home-v21 .tyz-services .tyz-service a{
 color:#f0c583!important;border-top-color:rgba(221,174,110,.2);
}
#tyz-home-v21 .tyz-services .tyz-service:is(:hover,:focus-within) a{
 color:#89531d!important;letter-spacing:.012em;
}
html[data-tyz-theme="dark"] #tyz-home-v21 .tyz-services .tyz-service:is(:hover,:focus-within) a{
 color:#ffe0a9!important
}
@media(max-width:900px){
 #tyz-home-v21 .tyz-services .tyz-service{
  min-height:285px;padding:24px!important
 }
 #tyz-home-v21 .tyz-service-grid{gap:15px}
}
@media(max-width:620px){
 #tyz-home-v21 .tyz-services .tyz-service{min-height:255px!important;border-radius:21px!important}
 #tyz-home-v21 .tyz-services .tyz-service:hover{transform:none!important}
 #tyz-home-v21 .tyz-services .tyz-service .tyz-service__icon{margin:18px 0!important}
 #tyz-home-v21 .tyz-services .tyz-service p{max-width:100%}
}
@media(prefers-reduced-motion:reduce){
 #tyz-home-v21 .tyz-services .tyz-service,
 #tyz-home-v21 .tyz-services .tyz-service::before,
 #tyz-home-v21 .tyz-services .tyz-service::after,
 #tyz-home-v21 .tyz-services .tyz-service__icon,
 #tyz-home-v21 .tyz-services .tyz-service__icon::after{
  transition:none!important;animation:none!important;
 }
}
