/* Kamera ve Alarm Rehberi: yönlendirmeli soru-cevap sihirbazı */
.rh-section{padding:64px 0 28px;background:linear-gradient(180deg,#fff 0%,var(--warm,#f7f5ee) 100%);scroll-margin-top:70px}
.rh{scroll-margin-top:90px;line-height:1.5;position:relative;overflow:hidden;border-radius:28px;background:#151515;color:#f4f2ea;box-shadow:0 30px 80px rgba(20,18,10,.28);isolation:isolate}
.rh::before{content:"";position:absolute;inset:-40% -20% auto auto;width:640px;height:640px;border-radius:50%;background:radial-gradient(circle,rgba(245,196,0,.20) 0%,rgba(245,196,0,0) 65%);z-index:-1;pointer-events:none}
.rh::after{content:"";position:absolute;inset:auto auto -45% -15%;width:560px;height:560px;border-radius:50%;background:radial-gradient(circle,rgba(245,196,0,.10) 0%,rgba(245,196,0,0) 65%);z-index:-1;pointer-events:none}
.rh-in{padding:40px clamp(20px,4vw,52px) 44px}

/* Üst çubuk: rozet, ilerleme, geri */
.rh-top{display:flex;align-items:center;gap:14px;margin:0 0 26px;min-height:36px}
.rh-badge{display:inline-flex;align-items:center;gap:8px;padding:7px 14px;border-radius:999px;background:rgba(245,196,0,.14);color:#f5c400;font:700 .8rem/1 Barlow,Arial,sans-serif;letter-spacing:.12em;text-transform:uppercase;white-space:nowrap}
.rh-badge i{width:8px;height:8px;border-radius:50%;background:#f5c400;box-shadow:0 0 0 4px rgba(245,196,0,.25);animation:rh-pulse 2s infinite}
.rh-prog{flex:1;height:8px;border-radius:99px;background:rgba(255,255,255,.10);overflow:hidden}
.rh-prog span{display:block;height:100%;width:0;border-radius:99px;background:linear-gradient(90deg,#f5c400,#ffdf4a);transition:width .45s cubic-bezier(.2,.8,.2,1)}
.rh-count{font:600 .9rem/1 Barlow,Arial,sans-serif;color:rgba(244,242,234,.62);white-space:nowrap}
.rh-back{display:inline-flex;align-items:center;gap:6px;padding:8px 14px;border:1px solid rgba(255,255,255,.18);border-radius:999px;background:transparent;color:#f4f2ea;font:600 .9rem/1 Barlow,Arial,sans-serif;cursor:pointer;transition:background .2s,border-color .2s}
.rh-back:hover,.rh-back:focus-visible{background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.35)}
.rh-back[hidden]{display:none}

/* Başlangıç ekranı */
.rh-intro{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);gap:40px;align-items:center}
.rh-intro h2{margin:0 0 14px;font:800 clamp(2.2rem,4.6vw,3.6rem)/1 "Barlow Condensed",Arial,sans-serif;color:#fff;letter-spacing:-.01em}
.rh-intro h2 mark{background:none;color:#f5c400}
.rh-intro p{margin:0 0 22px;font-size:1.08rem;line-height:1.6;color:rgba(244,242,234,.78);max-width:560px}
.rh-feats{display:flex;flex-wrap:wrap;gap:10px;margin:0 0 28px;padding:0;list-style:none}
.rh-feats li{display:inline-flex;align-items:center;gap:8px;padding:8px 14px;border-radius:12px;background:rgba(255,255,255,.07);font:600 .95rem/1.2 Barlow,Arial,sans-serif;color:#f4f2ea}
.rh-feats svg{width:18px;height:18px;color:#f5c400}
.rh-start{display:inline-flex;align-items:center;gap:12px;padding:17px 28px;border:0;border-radius:16px;background:#f5c400;color:#111;font:800 1.2rem/1 "Barlow Condensed",Arial,sans-serif;letter-spacing:.02em;cursor:pointer;box-shadow:0 12px 30px rgba(245,196,0,.35);transition:transform .2s,box-shadow .2s,background .2s}
.rh-start:hover,.rh-start:focus-visible{transform:translateY(-2px);background:#ffd21f;box-shadow:0 18px 40px rgba(245,196,0,.45)}
.rh-start svg{width:22px;height:22px;transition:transform .2s}
.rh-start:hover svg{transform:translateX(4px)}
.rh-orbit{position:relative;aspect-ratio:1/1;max-width:360px;margin:auto;width:100%}
.rh-orbit::before{content:"";position:absolute;inset:12%;border-radius:50%;border:1px dashed rgba(245,196,0,.35)}
.rh-orbit::after{content:"";position:absolute;inset:30%;border-radius:50%;background:radial-gradient(circle,rgba(245,196,0,.35),rgba(245,196,0,0) 70%)}
.rh-orb{position:absolute;display:grid;place-items:center;width:23%;aspect-ratio:1/1;border-radius:24px;background:#222;border:1px solid rgba(255,255,255,.10);color:#f5c400;box-shadow:0 14px 30px rgba(0,0,0,.35);animation:rh-float 5s ease-in-out infinite}
.rh-orb svg{width:46%;height:46%}
.rh-orb.center{left:38.5%;top:38.5%;background:#f5c400;color:#111;border:0;animation-delay:-2.5s}
.rh-orb:nth-child(2){left:38.5%;top:2%;animation-delay:-.8s}
.rh-orb:nth-child(3){right:2%;top:30%;animation-delay:-1.6s}
.rh-orb:nth-child(4){right:14%;bottom:4%;animation-delay:-2.4s}
.rh-orb:nth-child(5){left:14%;bottom:4%;animation-delay:-3.2s}
.rh-orb:nth-child(6){left:2%;top:30%;animation-delay:-4s}

/* Soru ekranı */
.rh-step{animation:rh-in .45s cubic-bezier(.2,.8,.2,1) both}
.rh-step.back{animation-name:rh-in-back}
.rh-q{margin:0 0 6px;font:800 clamp(1.8rem,3.4vw,2.6rem)/1.05 "Barlow Condensed",Arial,sans-serif;color:#fff;outline:none}
.rh-sub{margin:0 0 26px;color:rgba(244,242,234,.7);font-size:1.02rem}
.rh-note{display:inline-flex;align-items:center;gap:8px;margin:-10px 0 22px;padding:8px 14px;border-radius:10px;background:rgba(245,196,0,.12);color:#ffe27a;font-size:.95rem}
.rh-opts{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:14px}
.rh-opts.cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}
.rh-opt{position:relative;display:flex;flex-direction:column;align-items:flex-start;gap:12px;min-height:150px;padding:20px 20px 18px;border:1.5px solid rgba(255,255,255,.10);border-radius:20px;background:linear-gradient(180deg,rgba(255,255,255,.07),rgba(255,255,255,.03));color:#f4f2ea;text-align:left;font:inherit;cursor:pointer;transition:transform .22s cubic-bezier(.2,.8,.2,1),border-color .2s,background .2s,box-shadow .22s;animation:rh-pop .5s cubic-bezier(.2,.8,.2,1) both}
.rh-opt:hover,.rh-opt:focus-visible{transform:translateY(-4px);border-color:rgba(245,196,0,.65);background:linear-gradient(180deg,rgba(245,196,0,.12),rgba(255,255,255,.04));box-shadow:0 16px 34px rgba(0,0,0,.35);outline:none}
.rh-opt[aria-pressed="true"]{border-color:#f5c400;background:linear-gradient(180deg,rgba(245,196,0,.22),rgba(245,196,0,.06));box-shadow:0 0 0 4px rgba(245,196,0,.18),0 16px 34px rgba(0,0,0,.35)}
.rh-ic{display:grid;place-items:center;width:52px;height:52px;border-radius:16px;background:rgba(245,196,0,.14);color:#f5c400;transition:background .2s,color .2s,transform .3s}
.rh-ic svg{width:28px;height:28px}
.rh-ic.txt{font:800 1.45rem/1 "Barlow Condensed",Arial,sans-serif;width:auto;min-width:52px;padding:0 12px}
.rh-opt:hover .rh-ic,.rh-opt[aria-pressed="true"] .rh-ic{background:#f5c400;color:#111;transform:rotate(-6deg) scale(1.04)}
.rh-ot{font:700 1.18rem/1.15 "Barlow Condensed",Arial,sans-serif;color:#fff;letter-spacing:.01em}
.rh-od{display:inline-block;margin-top:4px;font-size:.92rem;line-height:1.35;color:rgba(244,242,234,.66)}
.rh-tick{position:absolute;top:14px;right:14px;display:grid;place-items:center;width:26px;height:26px;border-radius:50%;border:1.5px solid rgba(255,255,255,.25);color:transparent;transition:all .2s}
.rh-tick svg{width:14px;height:14px}
.rh-opt[aria-pressed="true"] .rh-tick{background:#f5c400;border-color:#f5c400;color:#111;transform:scale(1.08)}
.rh-actions{display:flex;flex-wrap:wrap;align-items:center;gap:14px;margin-top:26px}
.rh-next{display:inline-flex;align-items:center;gap:10px;padding:14px 24px;border:0;border-radius:14px;background:#f5c400;color:#111;font:800 1.08rem/1 "Barlow Condensed",Arial,sans-serif;letter-spacing:.02em;cursor:pointer;transition:transform .2s,background .2s}
.rh-next:hover,.rh-next:focus-visible{transform:translateY(-2px);background:#ffd21f}
.rh-next svg{width:18px;height:18px}
.rh-hint{color:rgba(244,242,234,.55);font-size:.92rem}

/* Sayaç (alarm: giriş ve oda sayısı) */
.rh-counters{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:14px}
.rh-counter{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:20px;border:1.5px solid rgba(255,255,255,.10);border-radius:20px;background:rgba(255,255,255,.05);animation:rh-pop .5s cubic-bezier(.2,.8,.2,1) both}
.rh-counter b{display:block;font:700 1.15rem/1.15 "Barlow Condensed",Arial,sans-serif;color:#fff}
.rh-counter small{color:rgba(244,242,234,.6);font-size:.88rem}
.rh-stepper{display:flex;align-items:center;gap:6px}
.rh-stepper button{width:42px;height:42px;border:0;border-radius:12px;background:rgba(255,255,255,.10);color:#fff;font:700 1.4rem/1 Barlow,Arial,sans-serif;cursor:pointer;transition:background .2s,color .2s}
.rh-stepper button:hover,.rh-stepper button:focus-visible{background:#f5c400;color:#111}
.rh-stepper output{min-width:48px;text-align:center;font:800 1.9rem/1 "Barlow Condensed",Arial,sans-serif;color:#f5c400}

/* Sonuç ekranı */
.rh-res-head{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:16px;margin:0 0 22px}
.rh-res-head h2{margin:8px 0 0;font:800 clamp(2rem,4vw,3rem)/1 "Barlow Condensed",Arial,sans-serif;color:#fff}
.rh-res-head p{margin:10px 0 0;color:rgba(244,242,234,.72);max-width:620px}
.rh-chips{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 26px}
.rh-chip{display:inline-flex;align-items:center;gap:6px;padding:7px 12px;border:1px solid rgba(255,255,255,.14);border-radius:999px;background:rgba(255,255,255,.05);color:#f4f2ea;font:500 .88rem/1.2 Barlow,Arial,sans-serif;cursor:pointer;transition:border-color .2s,background .2s}
.rh-chip:hover,.rh-chip:focus-visible{border-color:#f5c400;background:rgba(245,196,0,.12)}
.rh-chip svg{width:13px;height:13px;opacity:.7}
.rh-block{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.6fr);gap:24px;padding:26px;border-radius:24px;background:#f7f5ee;color:#292925;margin:0 0 18px;animation:rh-in .5s cubic-bezier(.2,.8,.2,1) both}
.rh-block + .rh-block{animation-delay:.08s}
.rh-block h3{display:flex;align-items:center;gap:10px;margin:0 0 4px;font:800 1.7rem/1.05 "Barlow Condensed",Arial,sans-serif;color:#171717}
.rh-block h3 .rh-ic{width:40px;height:40px;border-radius:12px;background:#171717;color:#f5c400;flex:none}
.rh-block h3 .rh-ic svg{width:22px;height:22px}
.rh-kicker{font:700 .78rem/1 Barlow,Arial,sans-serif;letter-spacing:.14em;text-transform:uppercase;color:#9a7b00}
.rh-why{margin:16px 0 0;padding:0;list-style:none;display:grid;gap:10px}
.rh-why li{display:flex;gap:10px;line-height:1.45}
.rh-why svg{flex:none;width:20px;height:20px;margin-top:1px;padding:3px;border-radius:50%;background:#f5c400;color:#111}
.rh-tips{margin:16px 0 0;padding:14px 16px;border-radius:14px;background:#fff;border:1px solid #e6e2d8;display:grid;gap:8px;font-size:.94rem}
.rh-tips div{display:flex;gap:8px}
.rh-tips svg{flex:none;width:18px;height:18px;color:#c69c00;margin-top:2px}
.rh-links{display:flex;flex-wrap:wrap;gap:10px;margin-top:16px}
.rh-links a{display:inline-flex;align-items:center;gap:6px;padding:9px 14px;border-radius:12px;background:#171717;color:#fff;text-decoration:none;font:600 .92rem/1.1 Barlow,Arial,sans-serif;transition:background .2s,color .2s}
.rh-links a.ghost{background:#fff;color:#171717;border:1px solid #d9d4c6}
.rh-links a:hover,.rh-links a:focus-visible{background:#f5c400;color:#111}
.rh-prods{display:grid;grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:12px;align-content:start}
.rh-prod{position:relative;display:flex;flex-direction:column;border:1px solid #e6e2d8;border-radius:18px;background:#fff;overflow:hidden;transition:transform .22s,box-shadow .22s,border-color .2s}
.rh-prod:hover{transform:translateY(-3px);box-shadow:0 14px 30px rgba(20,18,10,.12);border-color:#e8b800}
.rh-prod-img{display:block;aspect-ratio:1/1;background:#fff}
.rh-prod-img img{width:100%;height:100%;object-fit:contain;padding:10px}
.rh-prod-pct{position:absolute;top:10px;right:10px;padding:3px 9px;border-radius:8px;background:#f5c400;color:#111;font:800 .78rem/1.3 Barlow,Arial,sans-serif}
.rh-prod-info{display:flex;flex-direction:column;gap:8px;padding:4px 14px 14px;flex:1}
.rh-prod-info h4{margin:0;font:600 .95rem/1.3 Barlow,Arial,sans-serif;color:#171717;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;min-height:3.9em}
.rh-prod-info h4 a{color:inherit;text-decoration:none}
.rh-prod-info h4 a::after{content:"";position:absolute;inset:0}
.rh-price{margin-top:auto;display:flex;flex-direction:column}
.rh-price s{color:#8b887f;font-size:.82rem}
.rh-price strong{font:800 1.45rem/1.05 "Barlow Condensed",Arial,sans-serif;color:#171717}
.rh-price small{color:#8b887f;font-size:.72rem}
.rh-add{position:relative;z-index:2;display:flex;align-items:center;justify-content:center;min-height:38px;padding:8px 10px;border-radius:10px;background:#f5c400;color:#111;font:700 .9rem/1 Barlow,Arial,sans-serif;text-decoration:none;transition:background .2s}
.rh-add:hover,.rh-add:focus-visible{background:#e8b800}
.rh-add.done{background:#1f9d55;color:#fff}
.rh-add.busy{opacity:.65;pointer-events:none}
.rh-empty{padding:18px;border-radius:14px;background:#fff;border:1px dashed #d9d4c6;color:#66645d}
.rh-qty{display:inline-block;margin-left:6px;padding:2px 8px;border-radius:8px;background:#171717;color:#f5c400;font:700 .8rem/1.4 Barlow,Arial,sans-serif}
.rh-cta{display:flex;flex-wrap:wrap;align-items:center;gap:12px;margin-top:24px;padding:20px 22px;border-radius:20px;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.10)}
.rh-cta p{flex:1 1 260px;margin:0;color:rgba(244,242,234,.8)}
.rh-cta p b{color:#fff}
.rh-wa{display:inline-flex;align-items:center;gap:10px;padding:14px 22px;border-radius:14px;background:#1fb855;color:#fff;text-decoration:none;font:800 1.08rem/1 "Barlow Condensed",Arial,sans-serif;letter-spacing:.02em;box-shadow:0 10px 26px rgba(31,184,85,.35);transition:transform .2s,background .2s}
.rh-wa:hover,.rh-wa:focus-visible{transform:translateY(-2px);background:#1aa34b}
.rh-wa svg{width:20px;height:20px}
.rh-alt{display:inline-flex;align-items:center;gap:8px;padding:13px 18px;border:1px solid rgba(255,255,255,.22);border-radius:14px;color:#f4f2ea;text-decoration:none;font:700 1rem/1 Barlow,Arial,sans-serif;background:transparent;cursor:pointer;transition:background .2s,border-color .2s}
.rh-alt:hover,.rh-alt:focus-visible{background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.4)}
.rh-alt.yellow{border-color:#f5c400;color:#f5c400}

@keyframes rh-in{from{opacity:0;transform:translateX(28px)}to{opacity:1;transform:none}}
@keyframes rh-in-back{from{opacity:0;transform:translateX(-28px)}to{opacity:1;transform:none}}
@keyframes rh-pop{from{opacity:0;transform:translateY(14px) scale(.98)}to{opacity:1;transform:none}}
@keyframes rh-float{0%,100%{transform:translateY(0)}50%{transform:translateY(-10px)}}
@keyframes rh-pulse{0%{box-shadow:0 0 0 0 rgba(245,196,0,.5)}70%{box-shadow:0 0 0 10px rgba(245,196,0,0)}100%{box-shadow:0 0 0 0 rgba(245,196,0,0)}}

@media(max-width:900px){
  .rh-intro{grid-template-columns:1fr}
  .rh-orbit{max-width:240px;order:-1}
  .rh-block{grid-template-columns:1fr}
  .rh-opts.cols-3{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:600px){
  .rh-section{padding:36px 0 16px}
  .rh{border-radius:22px}
  .rh-in{padding:24px 16px 28px}
  .rh-count{display:none}
  .rh-opts,.rh-opts.cols-3{grid-template-columns:1fr 1fr;gap:10px}
  .rh-opt{min-height:0;padding:14px;gap:10px;border-radius:16px}
  .rh-ic{width:42px;height:42px;border-radius:12px}
  .rh-ic svg{width:22px;height:22px}
  .rh-ot{font-size:1.05rem}
  .rh-od{font-size:.84rem}
  .rh-block{padding:18px}
  .rh-prods{grid-template-columns:1fr 1fr}
  .rh-cta{padding:16px}
  .rh-wa,.rh-alt{width:100%;justify-content:center}
}
@media(prefers-reduced-motion:reduce){
  .rh *,.rh{animation:none!important;transition:none!important}
}
