/* sektör SSS: sayfadaki damlalı kart + /kimler-icin/<ad>/sss sayfası (2026-10-15). Kafe sayfası satır içi stil kullandığı için renkler yedekli. */
.sss-kart { position:relative; display:grid; grid-template-columns:230px minmax(0,1fr); gap:30px; align-items:center; padding:30px 34px; border-radius:30px; overflow:hidden;
  border:1px solid rgba(255,138,92,.32); color:var(--krem,#F6EFE6);
  background:radial-gradient(110% 140% at 0% 0%, rgba(255,90,54,.24), rgba(255,90,54,0) 58%), radial-gradient(90% 120% at 100% 100%, rgba(122,46,142,.32), rgba(122,46,142,0) 60%), rgba(255,255,255,.035);
  box-shadow:0 30px 70px rgba(0,0,0,.3); }
.sss-damla { width:230px; height:230px; object-fit:contain; filter:drop-shadow(0 22px 40px rgba(255,90,54,.38)); animation:sssSal 6s ease-in-out infinite; }
@keyframes sssSal { 50% { transform:translateY(-8px) rotate(-2deg); } }
.sss-kart .etiket, .sss-bas .etiket { display:inline-flex; font-size:12px; font-weight:700; letter-spacing:.16em; text-transform:uppercase; color:var(--gunes,#FFC53D); }
.sss-kart h2 { font-size:clamp(24px,3.4vw,34px); line-height:1.15; letter-spacing:-.02em; margin:8px 0 6px; }
.sss-kart > div > p { color:var(--soluk,rgba(246,239,230,.68)); font-size:16px; max-width:40em; }
.sss-onizle { list-style:none; padding:0; margin:16px 0 22px; display:grid; gap:9px; }
.sss-onizle li { display:flex; gap:10px; align-items:flex-start; font-weight:600; font-size:15px; line-height:1.4; }
.sss-onizle li::before { content:"?"; flex:none; width:22px; height:22px; border-radius:50%; display:grid; place-items:center; background:rgba(255,197,61,.18); color:var(--gunes,#FFC53D); font-size:13px; font-weight:800; margin-top:-1px; }
.sss-kart .btn svg, .sss-bas .btn svg { width:16px; height:16px; fill:none; stroke:currentColor; stroke-width:2; stroke-linecap:round; stroke-linejoin:round; }

/* SSS sayfası */
.sss-bas { display:grid; grid-template-columns:minmax(0,1fr) 260px; gap:30px; align-items:center; padding:26px 0 8px; }
.sss-bas h1 { font-size:clamp(38px,6vw,64px); line-height:1.02; letter-spacing:-.03em; margin:12px 0 12px; } .sss-bas h1 em { font-style:normal; color:var(--mercan2,#FF8A5C); }
.sss-bas p { color:var(--soluk,rgba(246,239,230,.68)); font-size:clamp(16px,2vw,18.5px); max-width:36em; }
.sss-bas .eylem { display:flex; gap:10px; flex-wrap:wrap; margin-top:22px; }
.sss-bas .sss-damla { width:260px; height:260px; justify-self:center; }
.sss-tam { max-width:920px; }
.sss-tam details[open] { border-color:rgba(255,138,92,.4); background:rgba(255,255,255,.05); }
.sss-sor { display:flex; gap:20px; align-items:center; justify-content:space-between; flex-wrap:wrap; max-width:920px; padding:22px 24px; border-radius:22px; border:1px solid var(--cizgi,rgba(246,239,230,.12)); background:rgba(255,255,255,.04); }
.sss-sor b { display:block; font-size:19px; } .sss-sor span { color:var(--soluk,rgba(246,239,230,.68)); font-size:15px; } .sss-sor .eylem { display:flex; gap:10px; flex-wrap:wrap; }
.sss-diger { display:flex; flex-wrap:wrap; gap:8px; }
.sss-diger a { padding:8px 14px; border-radius:999px; border:1px solid var(--cizgi,rgba(246,239,230,.12)); background:rgba(255,255,255,.04); text-decoration:none; color:inherit; font-weight:600; font-size:14px; transition:border-color .2s, background .2s; }
.sss-diger a:hover { border-color:rgba(255,138,92,.5); background:rgba(255,90,54,.08); }

@media (max-width:760px) {
  .sss-kart { grid-template-columns:1fr; gap:10px; padding:22px; text-align:left; } .sss-damla { width:150px; height:150px; justify-self:center; }
  .sss-bas { grid-template-columns:1fr; } .sss-bas .sss-damla { width:170px; height:170px; order:-1; }
}
@media (max-width:760px), (pointer:coarse) { .sss-damla { animation:none; } }
@media (prefers-reduced-motion:reduce) { .sss-damla { animation:none; } }