/* GadgetPeek v3: search hero + About page. Loaded after the main styles. */

/* ---------- Home hero ---------- */
.gp-h3-wrap { padding-top: 24px; padding-bottom: 8px; }
.gp-h3 { position: relative; overflow: hidden; border-radius: 28px; background: #B9562F; color: #fff; text-align: center; padding: 56px 32px 36px; }
.gp-h3::before { content: ""; position: absolute; right: -100px; top: -120px; width: 380px; height: 380px; border-radius: 50%; background: #E08A6C; opacity: .5; animation: gph3breathe 9s ease-in-out infinite; pointer-events: none; }
.gp-h3::after { content: ""; position: absolute; left: -90px; bottom: -130px; width: 300px; height: 300px; border-radius: 50%; background: #8E3E1F; opacity: .35; animation: gph3breathe 11s ease-in-out infinite reverse; pointer-events: none; }
.gp-h3 > * { position: relative; z-index: 1; }
.gp-h3__title { font-family: inherit; font-weight: 800; letter-spacing: -1.2px; line-height: 1.08; text-wrap: balance; font-size: clamp(34px, 4.8vw, 58px); margin: 0 auto 12px; max-width: 820px; color: #fff; }
.gp-h3__title em { font-style: normal; color: #FFF1C9; }
.gp-h3__sub { max-width: 540px; margin: 0 auto 24px; color: #FBD9C8; font-size: 17px; line-height: 1.55; }
.gp-h3__search { display: flex; max-width: 660px; margin: 0 auto 30px; background: #fff; border: 2px solid #fff; border-radius: 16px; overflow: hidden; box-shadow: 0 12px 34px rgba(80, 30, 10, .28); }
.gp-h3__search input[type=search] { flex: 1; min-width: 0; border: 0; padding: 18px 22px; font-family: inherit; font-size: 16px; font-weight: 500; color: #141413; background: transparent; outline: 0; box-shadow: none; border-radius: 0; }
.gp-h3__search button { border: 0; background: #8E3E1F; color: #fff; padding: 0 28px; font-family: inherit; font-size: 15px; font-weight: 700; cursor: pointer; border-radius: 0; transition: background .2s; }
.gp-h3__search button:hover { background: #141413; }
.gp-h3__boxes { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; text-align: left; }
.gp-h3__box { position: relative; overflow: hidden; border-radius: 22px; padding: 22px 24px 18px; min-height: 190px; display: flex; flex-direction: column; justify-content: space-between; color: #141413; transition: transform .25s ease, box-shadow .25s ease; }
.gp-h3__box:hover { transform: translateY(-5px); box-shadow: 0 16px 34px rgba(60, 20, 5, .3); }
.gp-h3__box.b1 { background: #fff; } .gp-h3__box.b2 { background: #FBEDE6; } .gp-h3__box.b3 { background: #FFF1C9; }
.gp-h3__k { font-size: 12px; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; display: flex; align-items: center; gap: 8px; }
.b1 .gp-h3__k { color: #B9562F; } .b2 .gp-h3__k { color: #B9562F; } .b3 .gp-h3__k { color: #8A6200; }
.gp-h3__k i { width: 8px; height: 8px; border-radius: 50%; background: currentColor; animation: gph3pulse 1.4s ease-in-out infinite; }
.gp-h3__view { position: relative; margin: 10px 0 12px; min-height: 92px; }
.gp-h3__item { position: absolute; inset: 0 0 auto 0; display: none; color: inherit; text-decoration: none; }
.gp-h3__item.is-on { display: block; animation: gph3in .6s cubic-bezier(.2, .8, .2, 1) both; }
.gp-h3__t { display: block; font-weight: 800; font-size: 21px; letter-spacing: -.5px; line-height: 1.2; }
.gp-h3__s { display: block; font-size: 13px; margin-top: 6px; opacity: .8; line-height: 1.4; }
.gp-h3__item:hover .gp-h3__t { text-decoration: underline; text-underline-offset: 3px; }
.gp-h3__foot { display: flex; justify-content: space-between; align-items: center; gap: 12px; font-weight: 700; font-size: 14px; }
.gp-h3__cta { color: inherit; text-decoration: none; } .gp-h3__cta:hover { text-decoration: underline; text-underline-offset: 3px; }
.gp-h3__dots { display: flex; gap: 5px; } .gp-h3__dots b { width: 6px; height: 6px; border-radius: 50%; background: currentColor; opacity: .25; transition: all .3s; } .gp-h3__dots b.on { opacity: 1; width: 18px; border-radius: 6px; background: #B9562F; }
.gp-h3__bar { position: absolute; left: 0; bottom: 0; height: 4px; width: 0; background: #B9562F; opacity: .5; }
@keyframes gph3in { from { opacity: 0; filter: blur(6px); } }
@keyframes gph3bar { from { width: 0; } to { width: 100%; } }
@keyframes gph3pulse { 50% { opacity: .3; } }
@keyframes gph3breathe { 50% { transform: scale(1.08); } }
@media (max-width: 820px) { .gp-h3 { padding: 40px 18px 26px; border-radius: 22px; } .gp-h3__boxes { grid-template-columns: minmax(0, 1fr); } .gp-h3__search button { padding: 0 16px; } }

/* ---------- About page ---------- */
.gp-ab3 { display: flex; flex-direction: column; gap: 64px; padding-top: 32px; padding-bottom: 72px; }
.gp-ab3 h1, .gp-ab3 h2, .gp-ab3 h3 { letter-spacing: -.8px; line-height: 1.12; text-wrap: balance; margin: 0; }
.gp-ab3 h1 { font-size: clamp(34px, 4.6vw, 56px); font-weight: 800; margin: 16px 0; }
.gp-ab3 h2 { font-size: clamp(26px, 3vw, 36px); font-weight: 800; margin: 12px 0 10px; }
.gp-ab3 h3 { font-size: 19px; font-weight: 700; letter-spacing: -.3px; }
.gp-ab3 p { margin: 0; color: #5E5D59; }
.gp-ab3__k { display: inline-block; font-size: 12px; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: #8E3E1F; background: #FBEDE6; padding: 7px 14px; border-radius: 999px; }
.gp-ab3__lead { font-size: 17px; max-width: 560px; margin-bottom: 22px !important; }
.gp-ab3__head { max-width: 660px; margin-bottom: 24px; }
.gp-ab3__hero { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr); gap: 36px; align-items: center; }
.gp-ab3__btns { display: flex; flex-wrap: wrap; gap: 10px; }
.gp-ab3__logo { background: linear-gradient(135deg, #FBEDE6, #F7DCCD); border-radius: 28px; min-height: 380px; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 22px; position: relative; overflow: hidden; padding: 30px; }
.gp-ab3__logo::before, .gp-ab3__logo::after { content: ""; position: absolute; border-radius: 50%; background: rgba(255, 255, 255, .45); animation: gph3breathe 8s ease-in-out infinite; }
.gp-ab3__logo::before { width: 240px; height: 240px; left: -70px; top: -70px; } .gp-ab3__logo::after { width: 200px; height: 200px; right: -60px; bottom: -60px; animation-delay: -3s; }
.gp-ab3__logobox { background: #fff; border-radius: 24px; padding: 26px 34px; box-shadow: 0 18px 40px rgba(142, 62, 31, .18); position: relative; z-index: 1; }
.gp-ab3__logobox img { display: block; width: min(300px, 100%); height: auto; }
.gp-ab3__stats { display: flex; gap: 12px; position: relative; z-index: 1; flex-wrap: wrap; justify-content: center; }
.gp-ab3__stats div { background: rgba(255, 255, 255, .85); border-radius: 16px; padding: 10px 16px; text-align: center; }
.gp-ab3__stats b { display: block; font-size: 22px; font-weight: 800; color: #B9562F; line-height: 1.1; }
.gp-ab3__stats small { font-size: 12px; font-weight: 600; color: #5E5D59; }
.gp-ab3__what { background: #fff; border: 1.5px solid #ECE6DF; border-radius: 28px; padding: 44px; display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.2fr); gap: 36px; }
.gp-ab3__what p + p { margin-top: 12px; } .gp-ab3__big { color: #141413 !important; font-size: 18px; }
.gp-ab3__def { background: #FBEDE6; border-radius: 20px; padding: 22px 24px; margin-top: 18px; font-weight: 600; color: #141413; border-left: 5px solid #B9562F; }
.gp-ab3__grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
.gp-ab3__card { border-radius: 22px; padding: 24px; display: flex; flex-direction: column; gap: 10px; transition: transform .25s, box-shadow .25s; }
.gp-ab3__card:hover { transform: translateY(-5px); box-shadow: 0 14px 30px rgba(120, 60, 30, .14); }
.gp-ab3__ic { width: 46px; height: 46px; border-radius: 14px; background: #fff; display: flex; align-items: center; justify-content: center; color: #B9562F; }
.gp-ab3__card.c1 { background: #F9D6D6; } .gp-ab3__card.c2 { background: #DCE5F6; } .gp-ab3__card.c3 { background: #DCE9D2; } .gp-ab3__card.c4 { background: #FFF1C9; } .gp-ab3__card.c5 { background: #F7DCCD; } .gp-ab3__card.c6 { background: #E6DDF3; }
.gp-ab3__steps { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; }
.gp-ab3__step { background: #fff; border: 1.5px solid #ECE6DF; border-radius: 22px; padding: 22px; }
.gp-ab3__step b { display: flex; width: 40px; height: 40px; align-items: center; justify-content: center; border-radius: 50%; background: #B9562F; color: #fff; font-size: 18px; margin-bottom: 12px; }
.gp-ab3__step h3 { margin-bottom: 6px; }
.gp-ab3__chips { display: flex; flex-wrap: wrap; gap: 10px; }
.gp-ab3__chips a { background: #fff; border: 1.5px solid #ECE6DF; border-radius: 999px; padding: 10px 18px; font-weight: 600; font-size: 14px; color: #141413; text-decoration: none; transition: all .2s; }
.gp-ab3__chips a:hover { background: #B9562F; color: #fff; border-color: #B9562F; transform: translateY(-3px); }
.gp-ab3__money { background: #FFF1C9; border-radius: 28px; padding: 36px 44px; display: flex; gap: 28px; align-items: center; justify-content: space-between; flex-wrap: wrap; }
.gp-ab3__money p { color: #5A4A1A; max-width: 640px; }
.gp-ab3__faq { display: flex; flex-direction: column; gap: 10px; max-width: 820px; }
.gp-ab3__faq details { background: #fff; border: 1.5px solid #ECE6DF; border-radius: 16px; padding: 0 22px; }
.gp-ab3__faq summary { cursor: pointer; padding: 18px 0; font-weight: 700; font-size: 16px; list-style: none; display: flex; justify-content: space-between; gap: 12px; color: #141413; }
.gp-ab3__faq summary::-webkit-details-marker { display: none; }
.gp-ab3__faq summary::after { content: "+"; color: #B9562F; font-size: 24px; line-height: 1; transition: transform .2s; }
.gp-ab3__faq details[open] summary::after { transform: rotate(45deg); }
.gp-ab3__faq details p { padding: 0 0 18px; }
.gp-ab3__cta { background: #B9562F; border-radius: 28px; padding: 48px 32px; text-align: center; }
.gp-ab3__cta h2 { color: #fff; } .gp-ab3__cta p { color: #FBD9C8; max-width: 480px; margin: 0 auto 22px; }
.gp-ab3__cta .gp-btn { background: #fff; color: #8E3E1F; }
@media (max-width: 860px) { .gp-ab3__hero, .gp-ab3__what { grid-template-columns: minmax(0, 1fr); } .gp-ab3__what { padding: 28px 22px; } .gp-ab3__grid, .gp-ab3__steps { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); } .gp-ab3__logo { min-height: 300px; } .gp-ab3__money { padding: 28px 22px; } }
@media (max-width: 540px) { .gp-ab3__grid, .gp-ab3__steps { grid-template-columns: minmax(0, 1fr); } }
@media (prefers-reduced-motion: reduce) { .gp-h3 *, .gp-h3::before, .gp-h3::after, .gp-ab3__logo::before, .gp-ab3__logo::after { animation: none !important; } }
