/* Şriftlər -dəki ilə yüklənir (@import request zənciri yaradırdı). */
/* ==========================================================================
Pinco AZ — Neon-Arkada
Kömür-bənövşəyi arkada kabineti · Pinco qırmızısı + turş laym CRT işığı
Namespace: pincoaz-
Arxetip: sidebar · Tema: dark · Forma: moderate · Sıxlıq: dense · Persona: retro
========================================================================== */
:root{
/* --- Rəng tokenləri (design card) --- */
--bg-main:#14121A;
--bg-card:#1D1A26;
--bg-lift:#262231;
--accent:#EA0120;
--accent-2:#B8FF29;
--text-main:#F4F2EC;
--text-muted:#9E98AC;
--border:#2E2A3A;
--on-accent:#FFFFFF;
/* --- Şrift --- */
--font-head:'Oswald','Arial Narrow',Arial,sans-serif;
--font-body:'IBM Plex Sans',system-ui,-apple-system,Segoe UI,Arial,sans-serif;
--font-label:'IBM Plex Mono',ui-monospace,SFMono-Regular,Consolas,monospace;
/* --- Geometriya (SHAPE: moderate) --- */
--r:8px;
--r-sm:6px;
--r-lg:10px;
/* --- Ritm (DENSITY: dense) --- */
--sp-1:4px;
--sp-2:8px;
--sp-3:12px;
--sp-4:16px;
--sp-5:24px;
--sp-6:32px;
--sec-pad:44px;
--card-pad:16px;
--gutter:20px;
/* --- Ölçülər (sidebar arxetipi) --- */
--wrap:1100px;
--rail-w:260px;
--hdr-h:60px;
}
/* Dar masaüstündə rail məzmunu sıxmasın */
@media(min-width:960px) and (max-width:1199px){
:root{--rail-w:212px}
}
/* Geniş ekranda bölmələr bir-birinə yapışmasın */
@media(min-width:960px){
:root{--sec-pad:64px}
}
/* ==========================================================================
RESET / BASE
========================================================================== */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{
margin:0;
background:var(--bg-main);
color:var(--text-main);
font-family:var(--font-body);
font-size:16px;
line-height:1.5;
overflow-x:hidden;
-webkit-font-smoothing:antialiased;
}
img{max-width:100%}
h1,h2,h3,h4,h5{
font-family:var(--font-head);
font-weight:600;
letter-spacing:.02em;
text-transform:uppercase;
line-height:1.14;
margin:0 0 var(--sp-3);
text-wrap:balance;
}
h1{font-size:clamp(1.85rem,3.4vw,2.7rem)}
h2{font-size:clamp(1.4rem,2.4vw,1.95rem)}
h3{font-size:clamp(1.1rem,1.6vw,1.3rem)}
h4{font-size:1.02rem}
p{margin:0 0 var(--sp-4)}
p:last-child{margin-bottom:0}
a{color:var(--accent-2);text-decoration:none}
a:hover{text-decoration:underline}
/* Mətn içindəki keçidlər yalnız rənglə seçilməməlidir (WCAG 1.4.1) */
main p a,main li a,main dd a,main td a{
text-decoration:underline;
text-decoration-thickness:1px;
text-underline-offset:.18em;
}
main p a.pincoaz-btn,main li a.pincoaz-btn{text-decoration:none}
ul,ol{margin:0 0 var(--sp-4);padding-inline-start:1.2em}
li{margin-bottom:var(--sp-2)}
strong,b{font-weight:600;color:var(--text-main)}
small{font-size:.82rem}
:focus-visible{
outline:2px solid var(--accent-2);
outline-offset:2px;
border-radius:2px;
}
::selection{background:var(--accent);color:var(--on-accent)}
/* Uzun sətirlər */
p,li,td,th,dd,dt,summary,h1,h2,h3,figcaption{overflow-wrap:anywhere}
/* ==========================================================================
LAYOUT: SIDEBAR ARXETİPİ
Sol rail (260px) body-nin özündə rezerv olunur — heç bir wrapper yoxdur.
========================================================================== */
body{padding-inline-start:var(--rail-w)}
.pincoaz-container{
width:100%;
max-width:var(--wrap);
margin-inline:auto;
padding-inline:var(--gutter);
}
section,
.pincoaz-section{
padding-block:var(--sec-pad);
position:relative;
}
.pincoaz-section--alt{background:var(--bg-card)}
/* Bölmə başlığı — laym CRT hairline */
.pincoaz-eyebrow{
font-family:var(--font-label);
font-size:.72rem;
letter-spacing:.16em;
text-transform:uppercase;
color:var(--accent-2);
display:block;
margin-bottom:var(--sp-2);
}
.pincoaz-lead{
color:var(--text-muted);
font-size:1.02rem;
margin-bottom:var(--sp-5);
}
/* Sidebar-daxili məzmun şəbəkəsi (aside rail olan səhifə bloku) */
.pincoaz-layout{
display:grid;
grid-template-columns:1fr;
gap:var(--sp-6);
}
.pincoaz-layout__main{min-width:0}
.pincoaz-layout__aside{min-width:0}
@media(min-width:960px){
.pincoaz-layout{grid-template-columns:minmax(0,1fr) 300px}
.pincoaz-layout__aside{position:sticky;top:var(--sp-5);align-self:start}
}
/* ==========================================================================
HEADER — vertikal nav-rail (sidebar arxetipi)
========================================================================== */
.pincoaz-header{
position:fixed;
inset-block:0;
inset-inline-start:0;
width:var(--rail-w);
background:var(--bg-card);
border-inline-end:1px solid var(--border);
display:flex;
flex-direction:column;
padding:var(--sp-5) var(--sp-4);
gap:var(--sp-5);
z-index:900;
overflow-y:auto;
}
/* Loqo */
.pincoaz-logo{
display:inline-flex;
align-items:center;
flex-shrink:0;
text-decoration:none;
}
.pincoaz-logo:hover{text-decoration:none}
.pincoaz-logo__img{
height:40px;
width:auto;
object-fit:contain;
display:block;
}
.pincoaz-logo__mark{
font-family:var(--font-head);
font-size:1.5rem;
font-weight:700;
letter-spacing:.06em;
text-transform:uppercase;
color:var(--text-main);
}
.pincoaz-logo__mark em{color:var(--accent);font-style:normal}
.pincoaz-header__tag{
font-family:var(--font-label);
font-size:.68rem;
letter-spacing:.14em;
text-transform:uppercase;
color:var(--text-muted);
margin-top:calc(var(--sp-3) * -1 + 2px);
}
/* Naviqasiya */
.pincoaz-nav{
display:flex;
flex-direction:column;
gap:2px;
flex:1 1 auto;
}
.pincoaz-nav ul{
list-style:none;
margin:0;
padding:0;
display:flex;
flex-direction:column;
gap:2px;
}
.pincoaz-nav li{margin:0}
.pincoaz-nav a:not(.pincoaz-btn){
display:block;
padding:9px var(--sp-3);
border-radius:var(--r-sm);
color:var(--text-main);
font-family:var(--font-head);
font-size:.95rem;
font-weight:500;
letter-spacing:.04em;
text-transform:uppercase;
border-inline-start:2px solid transparent;
transition:background .15s,color .15s,border-color .15s;
}
.pincoaz-nav a:not(.pincoaz-btn):hover,
.pincoaz-nav a:not(.pincoaz-btn):focus-visible{
background:var(--bg-lift);
color:var(--accent-2);
border-inline-start-color:var(--accent-2);
text-decoration:none;
}
.pincoaz-nav a:not(.pincoaz-btn)[aria-current="page"]{
color:var(--accent-2);
border-inline-start-color:var(--accent);
background:var(--bg-lift);
}
.pincoaz-nav__sep{
height:1px;
background:var(--border);
margin:var(--sp-3) 0;
border:0;
}
/* Rail-in altındakı CTA blok */
.pincoaz-header__foot{
margin-top:auto;
display:flex;
flex-direction:column;
gap:var(--sp-2);
flex-shrink:0;
}
.pincoaz-header__cta{width:100%;justify-content:center}
.pincoaz-age{
font-family:var(--font-label);
font-size:.7rem;
letter-spacing:.1em;
color:var(--text-muted);
text-align:center;
padding-top:var(--sp-2);
border-top:1px solid var(--border);
}
.pincoaz-age b{color:var(--accent-2);font-weight:500}
/* Burger — yalnız mobil rejimdə */
.pincoaz-burger{
display:none;
flex-direction:column;
justify-content:center;
align-items:center;
gap:5px;
width:44px;
height:44px;
flex-shrink:0;
padding:0;
background:transparent;
border:1px solid var(--border);
border-radius:var(--r-sm);
cursor:pointer;
}
.pincoaz-burger span{
display:block;
width:22px;
height:2px;
background:var(--text-main);
border-radius:1px;
transition:transform .2s,opacity .2s;
}
.pincoaz-header.is-open .pincoaz-burger span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.pincoaz-header.is-open .pincoaz-burger span:nth-child(2){opacity:0}
.pincoaz-header.is-open .pincoaz-burger span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
/* --- Mobil: rail yuxarı panelə çevrilir --- */
@media(max-width:959px){
body{padding-inline-start:0;padding-top:var(--hdr-h)}
/* hash ilə birbaşa girişdə hədəf sabit başlığın altında qalmasın */
[id]{scroll-margin-top:calc(var(--hdr-h) + 8px)}
.pincoaz-header{
position:fixed;
inset:0 0 auto 0;
width:100%;
min-height:var(--hdr-h);
flex-direction:row;
align-items:center;
justify-content:space-between;
flex-wrap:wrap;
gap:var(--sp-3);
padding:var(--sp-2) var(--sp-3);
border-inline-end:0;
border-bottom:1px solid var(--border);
overflow:visible;
}
.pincoaz-logo__img{height:32px;max-width:min(45vw,150px)}
.pincoaz-header__tag{display:none}
.pincoaz-burger{display:flex;order:3}
.pincoaz-nav{
display:none;
order:5;
flex:1 0 100%;
max-height:calc(100vh - var(--hdr-h) - 16px);
overflow-y:auto;
padding-block:var(--sp-3);
border-top:1px solid var(--border);
}
.pincoaz-header.is-open .pincoaz-nav{display:flex}
.pincoaz-header__foot{
order:2;
margin-top:0;
flex-direction:row;
align-items:center;
gap:var(--sp-2);
}
.pincoaz-header__cta{width:auto;padding:9px 14px;font-size:.82rem}
.pincoaz-header__foot .pincoaz-btn--ghost{display:none}
.pincoaz-age{display:none}
}
@media(max-width:479px){
.pincoaz-header__cta{display:none}
.pincoaz-logo__img{height:28px;max-width:min(45vw,120px)}
}
/* ==========================================================================
DÜYMƏLƏR
========================================================================== */
.pincoaz-btn{
display:inline-flex;
align-items:center;
justify-content:center;
gap:var(--sp-2);
padding:11px 20px;
border-radius:var(--r);
border:1px solid transparent;
background:var(--accent);
color:var(--on-accent);
font-family:var(--font-head);
font-size:.92rem;
font-weight:600;
letter-spacing:.06em;
text-transform:uppercase;
text-decoration:none;
cursor:pointer;
transition:filter .15s,border-color .15s,color .15s,background .15s;
min-width:0;
}
.pincoaz-btn:hover{filter:brightness(1.12);text-decoration:none;color:var(--on-accent)}
.pincoaz-btn--ghost{
background:transparent;
border-color:var(--accent-2);
color:var(--accent-2);
}
.pincoaz-btn--ghost:hover{background:var(--accent-2);color:var(--bg-main);filter:none}
.pincoaz-btn--lg{padding:14px 26px;font-size:1rem}
.pincoaz-btn--sm{padding:8px 14px;font-size:.8rem}
.pincoaz-btn--block{display:flex;width:100%}
/* Rail-də hər iki düymə tam enli */
.pincoaz-header__foot .pincoaz-btn{width:100%}
/* ==========================================================================
İKONLAR
========================================================================== */
.pincoaz-icon{
width:1.5em;
height:1.5em;
display:inline-block;
vertical-align:middle;
flex-shrink:0;
stroke:currentColor;
fill:none;
stroke-width:1.6;
}
.pincoaz-icon--lg{width:2rem;height:2rem}
/* ==========================================================================
HERO
========================================================================== */
.pincoaz-hero{position:relative;overflow:hidden}
.pincoaz-hero__inner{position:relative}
.pincoaz-hero h1{margin-bottom:var(--sp-3)}
.pincoaz-hero__sub{
color:var(--text-muted);
font-size:1.05rem;
margin-bottom:var(--sp-5);
}
.pincoaz-hero__actions{
display:flex;
flex-wrap:wrap;
gap:var(--sp-3);
}
/* Hero şəkli — universal qaydalar */
.pincoaz-hero__img{
display:block;
width:100%;
height:auto;
max-height:70vh;
aspect-ratio:3/2;
object-fit:cover;
border-radius:var(--r);
}
.pincoaz-hero__visual{
position:relative;
min-width:0;
border-radius:var(--r);
overflow:hidden;
border:1px solid var(--accent-2);
}
/* Fallback plaseholder — real şəkil olmayanda */
.pincoaz-hero__visual:not(:has(img))::before{
content:"";
display:block;
aspect-ratio:3/2;
background:var(--bg-lift);
}
/* --- HOME: image-first (tək mərkəzi sütun, vizual əvvəl) --- */
.pincoaz-hero--home{
padding-block:var(--sec-pad) calc(var(--sec-pad) + 8px);
border-bottom:1px solid var(--border);
}
/* gap:0 + fərdi margin — vahid 24px ritmi ierarxiyanı yastılaşdırırdı */
.pincoaz-hero--home .pincoaz-hero__inner{
display:flex;
flex-direction:column;
align-items:center;
text-align:center;
gap:0;
}
.pincoaz-hero--home .pincoaz-hero__visual{margin-bottom:var(--sp-5)}
.pincoaz-hero--home .pincoaz-offer{margin-top:var(--sp-5)}
.pincoaz-hero--home .pincoaz-hero__actions{margin-top:var(--sp-6)}
.pincoaz-hero--home .pincoaz-hero__visual{
order:-1;
width:100%;
}
.pincoaz-hero--home .pincoaz-hero__actions{justify-content:center}
.pincoaz-hero--home .pincoaz-hero__sub{
margin-bottom:0;
font-size:1.08rem;
max-width:62ch;
}
.pincoaz-hero--home h1{margin-bottom:var(--sp-3)}
.pincoaz-hero--home .pincoaz-eyebrow{margin-bottom:var(--sp-2)}
/* ==========================================================================
BONUS-OFFER — hero-nun imza elementi (arkada avtomatının marka lövhəsi)
Qırmızı marka zolağı + tünd tablo: iki rəqəm, ortada laym "+".
========================================================================== */
.pincoaz-offer{
display:inline-flex;
flex-direction:column;
max-width:100%;
border:1px solid var(--accent-2);
border-radius:var(--r);
overflow:hidden;
text-align:center;
box-shadow:0 0 0 4px rgba(184,255,41,.07);
}
.pincoaz-offer__head{
margin:0;
padding:7px var(--sp-4);
background:var(--accent);
color:var(--on-accent);
font-family:var(--font-label);
font-size:.72rem;
font-weight:500;
letter-spacing:.18em;
text-transform:uppercase;
}
.pincoaz-offer__body{
display:flex;
align-items:flex-start;
justify-content:center;
gap:clamp(var(--sp-3),3vw,var(--sp-5));
padding:var(--sp-4) clamp(var(--sp-4),4vw,var(--sp-6));
background:var(--bg-lift);
}
.pincoaz-offer__item{min-width:0}
.pincoaz-offer__value{
display:block;
font-family:var(--font-head);
font-size:clamp(1.7rem,5.6vw,2.4rem);
font-weight:700;
line-height:1;
letter-spacing:.01em;
color:var(--accent-2);
text-shadow:0 0 20px rgba(184,255,41,.3);
white-space:nowrap;
}
.pincoaz-offer__item--alt .pincoaz-offer__value{
color:var(--text-main);
text-shadow:none;
}
.pincoaz-offer__label{
display:block;
margin-top:8px;
font-family:var(--font-label);
font-size:.74rem;
letter-spacing:.1em;
text-transform:uppercase;
color:var(--text-muted);
}
.pincoaz-offer__plus{
flex-shrink:0;
margin-top:.2em;
font-family:var(--font-head);
font-size:clamp(1.2rem,3.4vw,1.6rem);
font-weight:500;
line-height:1;
color:var(--accent-2);
}
/* 320px: etiketlər bir sətirdə qalsın */
@media(max-width:479px){
.pincoaz-offer__body{padding-inline:var(--sp-3);gap:var(--sp-2)}
.pincoaz-offer__label{font-size:.7rem;letter-spacing:.05em}
}
/* --- INNER: kompakt səhifə başlığı --- */
.pincoaz-hero--inner{
position:relative;
padding-block:var(--sp-6);
min-height:150px;
display:flex;
align-items:center;
background:var(--bg-card);
border-bottom:1px solid var(--border);
border-radius:0;
padding-inline:max(var(--gutter),calc((100% - var(--wrap))/2 + var(--gutter)));
}
/* static: fon şəkli və gradient bütün bölməni tutsun, gutter-lə kəsilməsin */
.pincoaz-hero--inner .pincoaz-hero__inner{
position:static;
width:100%;
max-width:var(--wrap);
}
.pincoaz-hero--inner h1{
margin:0;
font-size:clamp(1.6rem,2.8vw,2.15rem);
text-wrap:balance;
}
.pincoaz-hero--inner .pincoaz-hero__sub{
margin:var(--sp-3) 0 0;
font-size:.98rem;
}
.pincoaz-hero--inner .pincoaz-hero__actions{margin-top:var(--sp-4)}
.pincoaz-hero--inner .pincoaz-hero__img{
position:absolute;
inset:0;
width:100%;
height:100%;
max-height:none;
aspect-ratio:auto;
object-fit:cover;
border-radius:0;
z-index:0;
}
.pincoaz-hero--inner:has(.pincoaz-hero__img) .pincoaz-hero__inner::after{
content:"";
position:absolute;
inset:0;
z-index:1;
background:linear-gradient(90deg,rgba(20,18,26,.93) 0%,rgba(20,18,26,.8) 55%,rgba(20,18,26,.6) 100%);
}
/* Bütün məzmun uşaqları şəklin üstünə qaldırılır */
:where(.pincoaz-hero--inner .pincoaz-hero__inner > :not(.pincoaz-hero__img)){
position:relative;
z-index:2;
}
/* ==========================================================================
PAGE-HEADER + BREADCRUMB
========================================================================== */
.pincoaz-page-header{
position:relative;
padding-block:var(--sp-6);
background:var(--bg-card);
border-bottom:1px solid var(--border);
}
.pincoaz-page-header h1{margin-bottom:0}
.pincoaz-page-header .pincoaz-breadcrumb{margin-bottom:var(--sp-3)}
.pincoaz-breadcrumb{
font-family:var(--font-label);
font-size:.74rem;
letter-spacing:.06em;
color:var(--text-muted);
margin-bottom:var(--sp-3);
}
.pincoaz-breadcrumb ol{
list-style:none;
display:flex;
flex-wrap:wrap;
gap:var(--sp-2);
margin:0;
padding:0;
}
.pincoaz-breadcrumb li{margin:0;display:flex;align-items:center;gap:var(--sp-2)}
.pincoaz-breadcrumb li+li::before{content:"/";color:var(--text-muted)}
.pincoaz-breadcrumb a{color:var(--text-muted);padding-block:6px}
.pincoaz-breadcrumb a:hover{color:var(--accent-2)}
.pincoaz-breadcrumb [aria-current]{color:var(--accent-2)}
/* ==========================================================================
OVERVIEW
========================================================================== */
.pincoaz-overview h2{margin-bottom:var(--sp-4)}
.pincoaz-overview__body>*:last-child{margin-bottom:0}
/* ==========================================================================
FEATURE-CARDS — FEATURES_PATTERN = icon-rows
Şəbəkə deyil: sol tərəfdə aksent çip, sağda mətn; mobil də üfüqi qalır.
========================================================================== */
.pincoaz-features{
display:flex;
flex-direction:column;
gap:0;
margin:0;
padding:0;
list-style:none;
}
.pincoaz-feature{
display:flex;
align-items:flex-start;
gap:var(--sp-4);
padding-block:var(--sp-4);
border-top:1px solid var(--border);
margin:0;
min-width:0;
}
.pincoaz-feature:first-child{border-top:0;padding-top:0}
.pincoaz-feature:last-child{padding-bottom:0}
.pincoaz-feature__icon{
flex-shrink:0;
width:44px;
height:44px;
display:flex;
align-items:center;
justify-content:center;
border-radius:var(--r);
background:var(--bg-lift);
border:1px solid var(--accent-2);
color:var(--accent-2);
}
.pincoaz-feature__icon .pincoaz-icon{width:1.4rem;height:1.4rem}
.pincoaz-feature__body{min-width:0;flex:1 1 auto}
.pincoaz-feature__title{
font-family:var(--font-head);
font-size:1.05rem;
font-weight:600;
letter-spacing:.03em;
text-transform:uppercase;
margin:0 0 var(--sp-1);
color:var(--text-main);
}
.pincoaz-feature__text{
margin:0;
color:var(--text-muted);
font-size:.95rem;
}
/* ==========================================================================
CARDS-GRID
========================================================================== */
.pincoaz-cards{
display:grid;
grid-template-columns:repeat(auto-fit,minmax(min(240px,100%),1fr));
gap:var(--sp-4);
margin:0;
padding:0;
list-style:none;
}
.pincoaz-cards>*{min-width:0}
.pincoaz-card{
background:var(--bg-card);
border:1px solid var(--border);
border-radius:var(--r);
padding:var(--card-pad);
display:flex;
flex-direction:column;
gap:var(--sp-2);
margin:0;
transition:border-color .15s;
}
.pincoaz-card:hover{border-color:var(--accent)}
.pincoaz-card__label{
font-family:var(--font-label);
font-size:.7rem;
letter-spacing:.14em;
text-transform:uppercase;
color:var(--accent-2);
}
.pincoaz-card__title{
font-family:var(--font-head);
font-size:1.08rem;
font-weight:600;
letter-spacing:.03em;
text-transform:uppercase;
margin:0;
color:var(--text-main);
}
.pincoaz-card p{margin:0;color:var(--text-muted);font-size:.95rem}
.pincoaz-card__foot{margin-top:auto;padding-top:var(--sp-2)}
/* ==========================================================================
DATA-TABLE — laym CRT-hairline başlıqlar
========================================================================== */
.pincoaz-table-wrap{
overflow-x:auto;
max-width:100%;
margin-block:1.5rem;
border:1px solid var(--border);
border-radius:var(--r);
-webkit-overflow-scrolling:touch;
/* sağ kənarda "daha var" kölgəsi — üfüqi sürüşmə görünsün */
background:
linear-gradient(to right,var(--bg-card) 30%,rgba(29,26,38,0)) left/28px 100% no-repeat,
linear-gradient(to left,var(--bg-card) 30%,rgba(29,26,38,0)) right/28px 100% no-repeat,
radial-gradient(farthest-side at 0 50%,rgba(0,0,0,.45),transparent) left/12px 100% no-repeat,
radial-gradient(farthest-side at 100% 50%,rgba(0,0,0,.45),transparent) right/12px 100% no-repeat;
background-attachment:local,local,scroll,scroll;
}
.pincoaz-table{
width:100%;
border-collapse:collapse;
font-size:.94rem;
background:var(--bg-card);
}
.pincoaz-table thead th{
font-family:var(--font-label);
font-size:.72rem;
font-weight:500;
letter-spacing:.12em;
text-transform:uppercase;
color:var(--accent-2);
text-align:start;
white-space:nowrap;
padding:10px var(--sp-3);
background:var(--bg-main);
border-top:1px solid var(--accent-2);
border-bottom:1px solid var(--border);
}
.pincoaz-table td,
.pincoaz-table tbody th{
padding:9px var(--sp-3);
border-top:1px solid var(--border);
vertical-align:top;
height:38px;
}
.pincoaz-table tbody th{
text-align:start;
font-weight:600;
color:var(--text-main);
white-space:nowrap;
}
.pincoaz-table tbody tr:first-child td,
.pincoaz-table tbody tr:first-child th{border-top:0}
.pincoaz-table tbody tr:hover{background:var(--bg-lift)}
.pincoaz-table .pincoaz-num{
font-family:var(--font-label);
color:var(--accent-2);
white-space:nowrap;
}
/* Ən yüksək RTP sətri — laym sol-bord */
.pincoaz-table tr.pincoaz-row--top td:first-child,
.pincoaz-table tr.pincoaz-row--top th:first-child{
box-shadow:inset 3px 0 0 var(--accent-2);
}
/* ==========================================================================
TWO-COLS + CONTENT-PANEL
========================================================================== */
.pincoaz-two{
display:grid;
grid-template-columns:1fr;
gap:var(--sp-5);
align-items:start;
}
.pincoaz-two>*{min-width:0}
@media(min-width:840px){
.pincoaz-two{grid-template-columns:minmax(0,1.35fr) minmax(0,1fr)}
}
.pincoaz-two__text>*:last-child{margin-bottom:0}
.pincoaz-panel{
background:var(--bg-card);
border:1px solid var(--border);
border-radius:var(--r);
padding:var(--card-pad);
}
.pincoaz-panel__title{
font-family:var(--font-head);
font-size:1rem;
font-weight:600;
letter-spacing:.05em;
text-transform:uppercase;
margin:0 0 var(--sp-3);
padding-bottom:var(--sp-2);
border-bottom:1px solid var(--accent-2);
color:var(--text-main);
}
/* Sürətli faktlar */
.pincoaz-facts{margin:0}
.pincoaz-facts__row{
display:flex;
flex-wrap:wrap;
justify-content:space-between;
align-items:baseline;
gap:var(--sp-2);
padding-block:9px;
border-top:1px solid var(--border);
}
.pincoaz-facts__row:first-child{border-top:0;padding-top:0}
.pincoaz-facts dt{
font-family:var(--font-label);
font-size:.74rem;
letter-spacing:.08em;
text-transform:uppercase;
color:var(--text-muted);
margin:0;
}
.pincoaz-facts dd{
margin:0;
font-weight:600;
font-size:.95rem;
color:var(--text-main);
text-align:end;
}
/* Çeklist */
.pincoaz-checklist{
list-style:none;
margin:0;
padding:0;
display:flex;
flex-direction:column;
gap:var(--sp-2);
}
.pincoaz-checklist li{
display:flex;
align-items:flex-start;
gap:var(--sp-2);
margin:0;
font-size:.94rem;
min-width:0;
}
.pincoaz-checklist .pincoaz-icon{
color:var(--accent-2);
width:1.15rem;
height:1.15rem;
margin-top:2px;
}
/* Mini stat kafelləri */
.pincoaz-minis{
display:grid;
grid-template-columns:repeat(auto-fit,minmax(min(110px,100%),1fr));
gap:var(--sp-2);
}
.pincoaz-minis>*{min-width:0}
.pincoaz-mini{
background:var(--bg-lift);
border-radius:var(--r-sm);
padding:var(--sp-3);
}
.pincoaz-mini__value{
font-family:var(--font-label);
font-size:1.2rem;
font-weight:600;
color:var(--accent-2);
display:block;
line-height:1.2;
}
.pincoaz-mini__label{
font-size:.74rem;
letter-spacing:.06em;
text-transform:uppercase;
color:var(--text-muted);
display:block;
margin-top:2px;
}
/* Reytinq nişanı */
.pincoaz-score{
display:flex;
flex-direction:column;
align-items:flex-start;
gap:var(--sp-1);
}
.pincoaz-score__value{
font-family:var(--font-head);
font-size:2.6rem;
font-weight:700;
line-height:1;
color:var(--accent-2);
}
.pincoaz-score__stars{display:flex;gap:2px;color:var(--accent)}
.pincoaz-score__stars .pincoaz-icon{width:1.05rem;height:1.05rem;fill:currentColor;stroke:none}
.pincoaz-score__label{
font-family:var(--font-label);
font-size:.74rem;
letter-spacing:.08em;
text-transform:uppercase;
color:var(--text-muted);
}
/* ==========================================================================
NUMBERED-LIST — oversized arkada rəqəmləri, laym kontur
========================================================================== */
.pincoaz-steps{
list-style:none;
counter-reset:pincoaz-step;
margin:0;
padding:0;
display:flex;
flex-direction:column;
gap:var(--sp-4);
}
.pincoaz-steps>li{
counter-increment:pincoaz-step;
display:flex;
align-items:flex-start;
gap:var(--sp-4);
margin:0;
min-width:0;
}
.pincoaz-steps>li::before{
content:counter(pincoaz-step,decimal-leading-zero);
flex-shrink:0;
font-family:var(--font-head);
font-size:2.2rem;
font-weight:700;
line-height:1;
letter-spacing:.02em;
color:transparent;
-webkit-text-stroke:1px var(--accent-2);
min-width:2.4ch;
}
.pincoaz-steps__title{
font-family:var(--font-head);
font-size:1.05rem;
font-weight:600;
letter-spacing:.03em;
text-transform:uppercase;
margin:0 0 var(--sp-1);
color:var(--text-main);
}
.pincoaz-steps__body{min-width:0}
.pincoaz-steps__body p{margin:0;color:var(--text-muted);font-size:.95rem}
/* ==========================================================================
STATS-BAR — STATS_PATTERN = counters
Qutusuz nəhəng rəqəmlər + kiçik versal etiket.
========================================================================== */
.pincoaz-stats{
display:grid;
grid-template-columns:repeat(auto-fit,minmax(min(160px,100%),1fr));
gap:var(--sp-5) var(--sp-4);
margin:0;
padding:0;
list-style:none;
}
.pincoaz-stats>*{min-width:0}
.pincoaz-stat{margin:0}
.pincoaz-stat__value{
display:block;
font-family:var(--font-head);
font-size:clamp(2.2rem,5vw,3.5rem);
font-weight:700;
line-height:1;
letter-spacing:.01em;
color:var(--accent);
}
.pincoaz-stat__label{
display:block;
margin-top:var(--sp-2);
font-family:var(--font-label);
font-size:.72rem;
letter-spacing:.14em;
text-transform:uppercase;
color:var(--text-muted);
}
/* ==========================================================================
CATEGORIES-BAR
========================================================================== */
.pincoaz-cats{
display:flex;
flex-wrap:wrap;
gap:var(--sp-2);
margin:0;
padding:0;
list-style:none;
}
.pincoaz-cats li{margin:0;min-width:0}
.pincoaz-cats a,
.pincoaz-cats span{
display:inline-flex;
align-items:center;
min-height:44px;
padding:7px 16px;
border-radius:var(--r);
border:1px solid var(--border);
background:var(--bg-card);
color:var(--text-main);
font-family:var(--font-label);
font-size:.82rem;
letter-spacing:.04em;
text-decoration:none;
transition:border-color .15s,color .15s;
}
.pincoaz-cats a:hover{border-color:var(--accent-2);color:var(--accent-2);text-decoration:none}
.pincoaz-cats .is-active{border-color:var(--accent);color:var(--accent-2)}
/* ==========================================================================
RTP-GRID — real örtük şəkilləri
========================================================================== */
.pincoaz-rtp{
display:grid;
gap:clamp(.6rem,1.5vw,1rem);
grid-template-columns:repeat(2,minmax(0,1fr));
margin:0;
padding:0;
list-style:none;
}
@media(min-width:640px){.pincoaz-rtp{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(min-width:960px){.pincoaz-rtp{grid-template-columns:repeat(4,minmax(0,1fr))}}
.pincoaz-rtp-item{
position:relative;
overflow:hidden;
min-width:0;
margin:0;
background:var(--bg-card);
border:1px solid var(--accent-2);
border-radius:var(--r);
transition:border-color .15s;
}
.pincoaz-rtp-item:hover{border-color:var(--accent)}
.pincoaz-rtp-item__thumb{
aspect-ratio:3/2;
position:relative;
background:var(--bg-lift);
overflow:hidden;
}
.pincoaz-rtp-item__thumb img{
width:100%;
height:100%;
object-fit:cover;
display:block;
}
.pincoaz-rtp-item__name{
display:block;
padding:9px var(--sp-3);
font-family:var(--font-head);
font-size:.88rem;
font-weight:500;
letter-spacing:.03em;
text-transform:uppercase;
color:var(--text-main);
overflow-wrap:anywhere;
}
.pincoaz-rtp-tooltip{
position:absolute;
bottom:0;
inset-inline:0;
opacity:0;
transition:opacity .2s;
background:rgba(20,18,26,.94);
border-top:1px solid var(--accent-2);
padding:var(--sp-2) var(--sp-3);
font-family:var(--font-label);
font-size:.76rem;
letter-spacing:.06em;
color:var(--accent-2);
pointer-events:none;
}
.pincoaz-rtp-item:hover .pincoaz-rtp-tooltip,
.pincoaz-rtp-item:focus-within .pincoaz-rtp-tooltip{opacity:1}
/* ==========================================================================
PAYMENTS-TABLE
========================================================================== */
.pincoaz-pay{
display:flex;
flex-direction:column;
gap:0;
margin:0;
padding:0;
list-style:none;
border:1px solid var(--border);
border-radius:var(--r);
background:var(--bg-card);
overflow:hidden;
}
.pincoaz-pay__row{
display:flex;
flex-wrap:wrap;
align-items:center;
gap:var(--sp-2) var(--sp-4);
padding:var(--sp-3) var(--card-pad);
border-top:1px solid var(--border);
margin:0;
min-width:0;
}
.pincoaz-pay__row:first-child{border-top:0}
.pincoaz-pay__name{
display:flex;
align-items:center;
gap:var(--sp-2);
font-weight:600;
min-width:140px;
flex:1 1 140px;
color:var(--text-main);
}
.pincoaz-pay__name .pincoaz-icon{color:var(--accent-2)}
.pincoaz-pay__meta{
font-family:var(--font-label);
font-size:.82rem;
color:var(--text-muted);
min-width:0;
}
.pincoaz-pay__meta b{color:var(--accent-2);font-weight:500}
/* ==========================================================================
FAQ — FAQ_PATTERN = two-col
========================================================================== */
.pincoaz-faq{
display:grid;
grid-template-columns:1fr;
align-items:start;
gap:0 var(--sp-6);
}
@media(min-width:840px){
.pincoaz-faq{grid-template-columns:repeat(2,minmax(0,1fr))}
}
.pincoaz-faq>*{min-width:0}
.pincoaz-faq details{
border-bottom:1px solid var(--border);
}
.pincoaz-faq summary{
cursor:pointer;
padding:1rem 0;
font-weight:600;
list-style:none;
display:flex;
align-items:flex-start;
gap:.5rem;
color:var(--text-main);
font-family:var(--font-body);
font-size:1rem;
}
.pincoaz-faq summary::-webkit-details-marker{display:none}
.pincoaz-faq summary::before{
content:'+';
margin-right:.5rem;
transition:transform .2s;
color:var(--accent-2);
font-family:var(--font-label);
font-weight:500;
flex-shrink:0;
}
.pincoaz-faq details[open] summary::before{content:'−'}
.pincoaz-faq details[open] summary{color:var(--accent-2)}
.pincoaz-faq details>:not(summary){
padding:.5rem 0 1rem;
color:var(--text-muted);
font-size:.95rem;
}
.pincoaz-faq details>:not(summary):last-child{margin-bottom:0}
/* ==========================================================================
TOC
========================================================================== */
.pincoaz-toc{
background:var(--bg-card);
border:1px solid var(--border);
border-inline-start:2px solid var(--accent-2);
border-radius:var(--r);
padding:var(--card-pad);
max-width:560px;
margin-bottom:var(--sp-6);
}
.pincoaz-toc__title{
font-family:var(--font-label);
font-size:.72rem;
letter-spacing:.14em;
text-transform:uppercase;
color:var(--accent-2);
margin:0 0 var(--sp-3);
}
.pincoaz-toc ol,
.pincoaz-toc ul{
list-style:none;
margin:0;
padding:0;
counter-reset:pincoaz-toc;
}
.pincoaz-toc li{
margin:0;
counter-increment:pincoaz-toc;
border-top:1px solid var(--border);
}
.pincoaz-toc li:first-child{border-top:0}
.pincoaz-toc a{
display:flex;
gap:var(--sp-2);
padding:8px 0;
color:var(--text-main);
font-size:.92rem;
}
.pincoaz-toc a::before{
content:counter(pincoaz-toc,decimal-leading-zero);
font-family:var(--font-label);
font-size:.76rem;
color:var(--text-muted);
flex-shrink:0;
}
.pincoaz-toc a:hover{color:var(--accent-2);text-decoration:none}
/* ==========================================================================
LEGAL-BODY
========================================================================== */
.pincoaz-legal{counter-reset:pincoaz-legal}
.pincoaz-legal>section{padding-block:0;margin-bottom:var(--sp-6)}
.pincoaz-legal>section:last-child{margin-bottom:0}
.pincoaz-legal h2{
counter-increment:pincoaz-legal;
display:flex;
gap:var(--sp-3);
align-items:baseline;
font-size:1.25rem;
margin-bottom:var(--sp-3);
padding-top:var(--sp-4);
border-top:1px solid var(--border);
}
.pincoaz-legal>section:first-child h2{border-top:0;padding-top:0}
.pincoaz-legal h2::before{
content:counter(pincoaz-legal,decimal-leading-zero);
font-family:var(--font-label);
font-size:.84rem;
font-weight:500;
color:var(--accent-2);
flex-shrink:0;
}
.pincoaz-legal h3{font-size:1.02rem;margin-top:var(--sp-4)}
/* uzun hüquqi mətn əsas rəngdə — muted bütün səhifəni solğun edirdi */
.pincoaz-legal p,
.pincoaz-legal li{color:var(--text-main);max-width:74ch}
.pincoaz-legal__meta{
font-family:var(--font-label);
font-size:.78rem;
color:var(--text-muted);
margin-bottom:var(--sp-5);
}
/* ==========================================================================
CTA-BLOCK
========================================================================== */
.pincoaz-cta{
background:var(--accent);
color:var(--on-accent);
border-radius:var(--r);
padding:var(--sec-pad) var(--sp-5);
text-align:center;
}
.pincoaz-cta__inner{
display:flex;
flex-direction:column;
align-items:center;
gap:var(--sp-3);
}
/* opacity çıxarıldı — qırmızı üzərində 3.07:1 verirdi (AA tələbi 4.5) */
.pincoaz-cta .pincoaz-eyebrow{color:var(--on-accent);margin-bottom:0}
.pincoaz-cta h2{color:var(--on-accent);margin:0}
.pincoaz-cta p{color:var(--on-accent);margin:0;max-width:62ch}
.pincoaz-cta a:not(.pincoaz-btn){color:var(--on-accent);text-decoration:underline}
.pincoaz-cta__actions{
display:flex;
flex-wrap:wrap;
gap:var(--sp-3);
justify-content:center;
margin-top:var(--sp-2);
}
.pincoaz-cta .pincoaz-btn{
background:var(--bg-main);
color:var(--text-main);
border-color:var(--bg-main);
}
.pincoaz-cta .pincoaz-btn:hover{background:var(--bg-card);border-color:var(--bg-card);color:var(--accent-2)}
.pincoaz-cta .pincoaz-btn--ghost{
background:transparent;
border-color:var(--on-accent);
color:var(--on-accent);
}
.pincoaz-cta .pincoaz-btn--ghost:hover{background:var(--on-accent);color:var(--accent)}
.pincoaz-cta__fine{
font-family:var(--font-label);
font-size:.8rem;
letter-spacing:.06em;
color:var(--on-accent);
margin:0;
}
/* ==========================================================================
STICKY-NAV (mobil alt panel)
========================================================================== */
.pincoaz-sticky{display:none}
@media(max-width:767px){
.pincoaz-sticky{
display:flex;
position:fixed;
inset-inline:0;
bottom:0;
z-index:850;
background:var(--bg-card);
border-top:1px solid var(--accent-2);
padding:6px 4px;
gap:2px;
}
.pincoaz-sticky a{
flex:1 1 0;
min-width:0;
display:flex;
flex-direction:column;
align-items:center;
gap:2px;
padding:4px 2px;
color:var(--text-muted);
font-family:var(--font-label);
font-size:.64rem;
letter-spacing:.04em;
text-transform:uppercase;
text-align:center;
text-decoration:none;
}
.pincoaz-sticky a .pincoaz-icon{width:1.2rem;height:1.2rem}
.pincoaz-sticky a:hover,
.pincoaz-sticky a.is-active{color:var(--accent-2);text-decoration:none}
/* rezerv yalnız panel həqiqətən varsa — əks halda 58px boş sahə qalırdı */
body:has(.pincoaz-sticky){padding-bottom:58px}
}
/* ==========================================================================
CHAT-WIDGET
========================================================================== */
.pincoaz-chat-btn{
position:fixed;
inset-inline-end:16px;
bottom:16px;
z-index:860;
width:52px;
height:52px;
display:flex;
align-items:center;
justify-content:center;
border:0;
border-radius:var(--r);
background:var(--accent);
color:var(--on-accent);
cursor:pointer;
}
.pincoaz-chat-btn .pincoaz-icon{width:1.5rem;height:1.5rem}
.pincoaz-chat{
position:fixed;
inset-inline-end:16px;
bottom:76px;
z-index:861;
width:min(320px,calc(100vw - 32px));
background:var(--bg-card);
border:1px solid var(--accent-2);
border-radius:var(--r);
padding:var(--card-pad);
}
.pincoaz-chat[hidden]{display:none}
.pincoaz-chat__title{
font-family:var(--font-head);
font-size:1rem;
letter-spacing:.04em;
text-transform:uppercase;
margin:0 0 var(--sp-2);
}
@media(max-width:767px){
.pincoaz-chat-btn{bottom:70px}
.pincoaz-chat{bottom:130px}
}
/* ==========================================================================
FOOTER
========================================================================== */
.pincoaz-footer{
background:var(--bg-card);
border-top:1px solid var(--accent-2);
padding-block:var(--sec-pad) var(--sp-5);
margin-top:var(--sec-pad);
}
.pincoaz-footer__grid{
display:grid;
grid-template-columns:1fr;
gap:var(--sp-5);
}
.pincoaz-footer__grid>*{min-width:0}
@media(min-width:760px){
.pincoaz-footer__grid{grid-template-columns:1.4fr 1fr 1fr}
}
.pincoaz-footer__brand p{
color:var(--text-muted);
font-size:.92rem;
margin-top:var(--sp-3);
}
.pincoaz-footer__col-title{
font-family:var(--font-label);
font-size:.72rem;
letter-spacing:.14em;
text-transform:uppercase;
color:var(--accent-2);
margin:0 0 var(--sp-3);
}
.pincoaz-footer ul{
list-style:none;
margin:0;
padding:0;
display:flex;
flex-direction:column;
gap:2px;
}
.pincoaz-footer li{margin:0}
.pincoaz-footer ul a{
display:inline-flex;
align-items:center;
min-height:40px;
color:var(--text-main);
font-size:.93rem;
}
.pincoaz-footer ul a:hover{color:var(--accent-2)}
.pincoaz-footer__disclaimer{
margin-top:var(--sp-6);
padding-top:var(--sp-4);
border-top:1px solid var(--border);
color:var(--text-muted);
font-size:.84rem;
line-height:1.6;
}
.pincoaz-footer__disclaimer p{margin:0 0 var(--sp-2)}
.pincoaz-footer__disclaimer p:last-child{margin-bottom:0}
.pincoaz-footer__age{
display:inline-flex;
align-items:center;
gap:6px;
font-family:var(--font-label);
font-size:.74rem;
letter-spacing:.1em;
color:var(--accent-2);
border:1px solid var(--accent-2);
border-radius:var(--r-sm);
padding:3px 8px;
margin-inline-end:var(--sp-2);
}
.pincoaz-footer__bottom{
margin-top:var(--sp-4);
padding-top:var(--sp-3);
border-top:1px solid var(--border);
display:flex;
flex-wrap:wrap;
justify-content:space-between;
gap:var(--sp-2) var(--sp-4);
font-family:var(--font-label);
font-size:.76rem;
letter-spacing:.04em;
color:var(--text-muted);
}
.pincoaz-footer__bottom a{color:var(--text-muted)}
.pincoaz-footer__bottom a:hover{color:var(--accent-2)}
/* ==========================================================================
MOTION
========================================================================== */
@media(prefers-reduced-motion:reduce){
*,*::before,*::after{
animation-duration:.01ms !important;
animation-iteration-count:1 !important;
transition-duration:.01ms !important;
scroll-behavior:auto !important;
}
}
/* sa-responsive-net */
table th{white-space:nowrap}
figure,blockquote,dl,dd,fieldset{margin:0}
/* sa-logo-chip */
.pincoaz-footer .pincoaz-logo__img{filter:none;background:transparent;padding:0}
.pincoaz-footer .pincoaz-footer__logo-chip{background:transparent;padding:0}
/* sa-logo-fit */
.pincoaz-logo__img{object-fit:contain}
/* sa-ph-media */
.pincoaz-page-header:has(.pincoaz-hero__img){position:relative;overflow:hidden;isolation:isolate;min-height:clamp(200px,30vh,300px);display:flex;flex-direction:column;justify-content:center}
.pincoaz-page-header:has(.pincoaz-hero__img) .pincoaz-hero__img{position:absolute;inset:0;width:100%;height:100%;max-height:none;aspect-ratio:auto;object-fit:cover;margin:0;z-index:0}
.pincoaz-page-header:has(.pincoaz-hero__img)::after{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(180deg,rgba(10,12,18,.72),rgba(10,12,18,.5))}
:where(.pincoaz-page-header:has(.pincoaz-hero__img)>:not(.pincoaz-hero__img)){position:relative}
.pincoaz-page-header:has(.pincoaz-hero__img)>:not(.pincoaz-hero__img){z-index:2}
.pincoaz-page-header:has(.pincoaz-hero__img),.pincoaz-page-header:has(.pincoaz-hero__img) h1,.pincoaz-page-header:has(.pincoaz-hero__img) a,.pincoaz-page-header:has(.pincoaz-hero__img) p,.pincoaz-page-header:has(.pincoaz-hero__img) li,.pincoaz-page-header:has(.pincoaz-hero__img) span{color:#fff}
/* sa-hero-media */
.pincoaz-hero:has(>.pincoaz-hero__img){position:relative;isolation:isolate}
.pincoaz-hero:has(>.pincoaz-hero__img)>.pincoaz-hero__img{z-index:0}
.pincoaz-hero:has(>.pincoaz-hero__img)::after{z-index:1}
:where(.pincoaz-hero:has(>.pincoaz-hero__img)>:not(.pincoaz-hero__img)){position:relative}
.pincoaz-hero:has(>.pincoaz-hero__img)>:not(.pincoaz-hero__img){z-index:2}
/* sa-rhythm */
:where(.pincoaz-table-wrap){margin-block:1.5rem}
:where(main) :where(ul,ol,table,.pincoaz-table-wrap)+p{margin-block-start:1rem}
/* sa-slot-link */
.pincoaz-rtp-item,.pincoaz-rtp-item:hover,.pincoaz-rtp-item:focus{color:inherit;text-decoration:none;cursor:pointer}
/* ==========================================================================
SON YENİLƏNMƏ ETİKETİ
========================================================================== */
.pincoaz-updated{margin:0 0 var(--sp-4)}
.pincoaz-updated small{
font-family:var(--font-label);
font-size:.76rem;
letter-spacing:.06em;
color:var(--text-muted);
}
/* ==========================================================================
MOBİL: oxunaqlıq və toxunma sahələri
Label-tipli mikro-mətn 11–12px idi, keçidlərin hündürlüyü 44px-dən aşağı.
========================================================================== */
@media(max-width:767px){
.pincoaz-eyebrow,
.pincoaz-card__label,
.pincoaz-stat__label,
.pincoaz-footer__col-title,
.pincoaz-facts dt,
.pincoaz-table thead th{
font-size:.8rem;
letter-spacing:.08em;
}
.pincoaz-breadcrumb{font-size:.82rem;letter-spacing:.03em}
.pincoaz-footer__bottom{font-size:.82rem}
.pincoaz-footer__disclaimer{font-size:.88rem}
small,.pincoaz-updated small{font-size:.86rem}
.pincoaz-nav a:not(.pincoaz-btn){padding:12px var(--sp-3)}
.pincoaz-footer ul a{min-height:44px}
.pincoaz-toc a{min-height:44px;align-items:center;font-size:.95rem}
.pincoaz-cta{padding-inline:var(--sp-4)}
}