/* hikiens shop css — v1 draft */
/* started 2024, bits added over time */

*,*::before,*::after { box-sizing:border-box; margin:0; padding:0 }
html { scroll-behavior:smooth }
body { font-family:Arial,'Segoe UI',Helvetica,sans-serif; font-size:16px; color:#000; background:#fff; line-height:1.6 }
img { max-width:100%; height:auto; display:block }
a { text-decoration:none; color:inherit }
ul { list-style:none }
input, button, select, textarea { font-family:inherit }

/* preconnect hint kept from original theme */
/* link rel preconnect href fonts.googleapis.com */

/* ============ CART BAR top strip ============ */

.cartBar {
  background:#1c4199;
  color:#fff;
  padding:9px 0;
  font-size:13px
}
.cartBar__inner {
    max-width:1200px;
    margin:0 auto;
    padding:0 24px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:16px
}
.cartBar__msg { opacity:.75; font-size:12px }
.cartBar__btn {
  background:#f4ab00;
  color:#000;
  border:none;
  padding:7px 18px;
  cursor:pointer;
  font-size:13px;
  font-weight:bold;
  display:flex;
  align-items:center;
  gap:7px
}
.cartBar__btn:hover { background:#ffca28 }
.cartBar__count {
    background:#fff;
    color:#1c4199;
    border-radius:50%;
    width:19px; height:19px;
    display:inline-flex; align-items:center; justify-content:center;
    font-size:10px; font-weight:bold
}

/* cart dropdown panel */
.cartDrop {
  position:fixed;
  top:0; right:-420px;
  width:400px; height:100vh;
  background:#fff;
  box-shadow:-3px 0 18px rgba(0,0,0,.14);
  z-index:9999;
  -webkit-transition:right .3s ease;
  transition:right .3s ease;
  display:flex; flex-direction:column
}
.cartDrop.is-open { right:0 }

.cartDrop__head {
  background:#1c4199;
  color:#fff;
  padding:15px 20px;
  display:flex; justify-content:space-between; align-items:center
}
.cartDrop__head h3 { font-size:15px; font-weight:bold }
.cartDrop__close {
  background:none; border:none; color:#fff;
  font-size:21px; cursor:pointer; line-height:1
}
.cartDrop__body { flex:1; overflow-y:auto; padding:14px }
.cartDrop__empty {
  text-align:center;
  padding:44px 20px;
  color:#999; font-size:14px
}
.cartDrop__item {
  display:flex; gap:10px;
  padding:11px 0;
  border-bottom:1px solid #eee
}
.cartDrop__item img { width:58px; height:58px; object-fit:cover; flex-shrink:0 }
.cartDrop__item-info { flex:1 }
.cartDrop__item-name { font-size:12px; font-weight:bold; margin-bottom:3px; line-height:1.4 }
.cartDrop__item-price { font-size:12px; color:#1c4199; margin-bottom:5px }
.cartDrop__item-qty { display:flex; align-items:center; gap:5px }
.cartDrop__item-qty button {
  background:#f0f0f0; border:none;
  width:21px; height:21px;
  cursor:pointer; font-size:13px; line-height:1
}
.cartDrop__item-qty span { font-size:13px; min-width:18px; text-align:center }
.cartDrop__item-del {
  background:none; border:none; color:#bbb;
  cursor:pointer; font-size:15px; align-self:flex-start; padding:2px
}
.cartDrop__item-del:hover { color:#c00 }
.cartDrop__foot { padding:14px; border-top:1px solid #e5e5e5 }
.cartDrop__total {
  font-size:15px; font-weight:bold; margin-bottom:11px;
  display:flex; justify-content:space-between
}
.cartDrop__checkout {
  background:#1c4199; color:#fff; border:none;
  width:100%; padding:13px;
  font-size:14px; cursor:pointer; font-weight:bold
}
.cartDrop__checkout:hover { background:#163285 }

.cartOverlay {
  position:fixed; inset:0;
  background:rgba(0,0,0,0.400000);
  z-index:9998; display:none
}
.cartOverlay.is-open { display:block }

/* ============ HEADER ============ */

.l-header {
  background:rgba(28,65,153,1.000000);
  position:fixed;
  top:0; left:0; width:100%;
  z-index:500;
  -webkit-transition:background .3s;
  transition:background .3s
}
.l-header--fixed.is-active { background:rgba(28,65,153,0.960000) }

.l-header__inner {
  max-width:1200px;
  margin:0 auto;
  padding:0 20px;
  display:flex; align-items:center; justify-content:space-between;
  height:68px
}
.l-header__logo img { height:42px; width:auto }

.p-menu-btn {
  color:#fff;
  background:none; border:none; cursor:pointer;
  display:none; flex-direction:column; gap:5px; padding:4px
}
.p-menu-btn span { display:block; width:24px; height:2px; background:#fff; -webkit-transition:all .3s; transition:all .3s }
.p-menu-btn.is-open span:nth-child(1) { -webkit-transform:translateY(7px) rotate(45deg); transform:translateY(7px) rotate(45deg) }
.p-menu-btn.is-open span:nth-child(2) { opacity:0 }
.p-menu-btn.is-open span:nth-child(3) { -webkit-transform:translateY(-7px) rotate(-45deg); transform:translateY(-7px) rotate(-45deg) }

.p-global-nav > ul { display:flex; gap:0; align-items:center }
.p-global-nav > ul > li { position:relative }
.p-global-nav > ul > li > a {
  color:#ffffff;
  padding:24px 15px;
  display:block; font-size:14px;
  -webkit-transition:color .2s; transition:color .2s
}
.p-global-nav > ul > li > a:hover { color:#f4ab00 }
.p-global-nav .sub-menu {
  background:#000000; color:#ffffff;
  position:absolute; top:100%; left:0;
  min-width:165px; display:none
}
.p-global-nav .sub-menu li a {
  background:#000000; color:#ffffff;
  display:block; padding:11px 16px; font-size:13px
}
.p-global-nav .sub-menu li a:hover { background:#1c4199; color:#ffffff }
.p-global-nav > ul > li:hover .sub-menu { display:block }

/* ============ HERO ============ */

.p-header-content {
  position:relative;
  height:100vh; min-height:520px;
  overflow:hidden; margin-top:68px
}
.p-header-content img { width:100%; height:100%; object-fit:cover }
.p-header-content__inner {
  position:absolute; inset:0;
  display:flex; align-items:flex-end;
  padding:58px 42px;
  background:rgba(0,0,0,0)
}
.p-header-content__title {
  color:#ffffff;
  font-size:42px;
  font-family:Arial,'ヒラギノ角ゴ ProN W3','Hiragino Kaku Gothic ProN','メイリオ',Meiryo,sans-serif;
  font-weight:bold;
  text-shadow:0 2px 9px rgba(0,0,0,.55)
}

/* ============ BLACK intro strip ============ */

.p-index-content01 { background:#000000; color:#ffffff; padding:62px 0 }
.p-index-content01 .l-inner { text-align:center }
.p-index-content01__title {
  font-size:38px;
  font-family:Arial,'ヒラギノ角ゴ ProN W3','Hiragino Kaku Gothic ProN','メイリオ',Meiryo,sans-serif;
  font-weight:bold; margin-bottom:18px
}
.p-index-content01__desc { font-size:16px; line-height:1.8; max-width:720px; margin:0 auto }

/* shared inner wrapper */
.l-inner { max-width:1200px; margin:0 auto; padding:0 20px }

/* cb wrapper */
.p-cb { margin-top:0 }
.p-cb__item { padding:58px 0 }

/* ============ IMAGE + TEXT blocks ============ */

.p-index-content02 { display:flex; align-items:center; gap:52px }
.p-index-content02--rev { flex-direction:row-reverse }
.p-index-content02__img { flex:1; overflow:hidden }
.p-index-content02__img img {
  width:100%; height:100%; object-fit:cover;
  -webkit-transform:scale(1); transform:scale(1);
  -webkit-transition:-webkit-transform .4s; transition:transform .4s
}
.p-index-content02__img:hover img { -webkit-transform:scale(1.1); transform:scale(1.1) }
.p-index-content02__content { flex:1 }
.p-index-content02__title {
  color:#1c4199;
  font-size:38px;
  font-family:Arial,'ヒラギノ角ゴ ProN W3','Hiragino Kaku Gothic ProN','メイリオ',Meiryo,sans-serif;
  font-weight:bold; margin-bottom:18px
}
.p-index-content02__desc { font-size:15px; line-height:1.8; margin-bottom:22px }
.p-index-content02__content .p-btn { display:inline-block }

/* ============ BTN ============ */

.p-btn {
  background:#1c4199; color:#fff;
  padding:13px 30px; font-size:14px; font-weight:bold;
  display:inline-block;
  -webkit-transition:opacity .2s; transition:opacity .2s
}
.p-btn:hover { opacity:.82; color:#fff }

/* ============ CATEGORY CARDS ============ */

.p-index-content03 { display:flex; gap:20px; flex-wrap:wrap }
.p-index-content03__item { flex:1; min-width:280px }
.p-article08__img { display:block; overflow:hidden; height:220px }
.p-article08__img img {
  width:100%; height:100%; object-fit:cover;
  -webkit-transform:scale(1); transform:scale(1);
  -webkit-transition:-webkit-transform .4s; transition:transform .4s
}
.p-hover-effect--type1:hover img { -webkit-transform:scale(1.1); transform:scale(1.1) }
.p-article08__content { background:#f5f5f5; padding:18px 20px }
.p-article08__desc { font-size:14px; line-height:1.7; margin-bottom:14px }
.p-article08__btn { text-align:center }

/* ============ PRODUCT GRIDS ============ */

.p-index-content06 { padding:58px 0 }
.p-index-content06__title {
  color:#1c4199; font-size:34px;
  font-family:Arial,'ヒラギノ角ゴ ProN W3','Hiragino Kaku Gothic ProN','メイリオ',Meiryo,sans-serif;
  font-weight:bold; margin-bottom:10px
}
.p-index-content06__desc { font-size:15px; margin-bottom:28px; color:#444 }
.p-index-content06__btn { text-align:center; margin-top:22px }

.p-plan-list { display:flex; gap:18px; flex-wrap:wrap; margin-bottom:26px }
.p-plan-list__item { flex:1; min-width:240px; border:1px solid #ddd; overflow:hidden }

/* product card */
.prodCard { border:1px solid #e0e0e0; overflow:hidden; background:#fff }
.prodCard__img { height:200px; overflow:hidden; display:block }
.prodCard__img img {
  width:100%; height:100%; object-fit:cover;
  -webkit-transform:scale(1); transform:scale(1);
  -webkit-transition:-webkit-transform .4s; transition:transform .4s
}
.prodCard:hover .prodCard__img img { -webkit-transform:scale(1.1); transform:scale(1.1) }
.prodCard__body { background:#f5f5f5 }
.prodCard__name {
  font-size:14px; font-weight:bold;
  background:#1c4199; color:#fff;
  padding:10px 14px; line-height:1.3
}
.p-plan-table01__data--price { background:#dce1ed; padding:10px 14px }
.p-plan-table01__price { color:#1c4199; font-size:26px; font-weight:bold; margin-bottom:2px }
.p-plan-table01__per { font-size:11px; color:#666 }
.prodCard__spec { padding:7px 14px; font-size:12px; color:#555; border-bottom:1px solid #e5e5e5 }
.prodCard__add {
  background:#1c4199; color:#fff; border:none;
  width:calc(100% - 28px); margin:10px 14px 12px;
  padding:10px; font-size:13px; cursor:pointer; font-weight:bold
}
.prodCard__add:hover { background:#163285 }

/* shop page grid */
.shopGrid { display:flex; gap:18px; flex-wrap:wrap; margin-top:26px }
.shopGrid .prodCard { flex:1; min-width:220px; max-width:calc(25% - 14px) }

/* section heading with border */
.p-index-content06__title { border-left:4px solid #f4ab00; padding-left:14px }

/* ============ CTA BANNER ============ */

.p-index-content07 {
  background-image:url(../images-hiking/cta-bg.webp);
  background-size:cover; background-position:center;
  padding:95px 0; text-align:center; position:relative
}
.p-index-content07::before {
  content:''; position:absolute; inset:0; background:rgba(0,0,0,.48)
}
.p-index-content07__inner { position:relative; z-index:1 }
.p-index-content07__title {
  font-size:34px; color:#fff;
  font-family:Arial,'ヒラギノ角ゴ ProN W3','Hiragino Kaku Gothic ProN','メイリオ',Meiryo,sans-serif;
  font-weight:bold; margin-bottom:14px
}
.p-index-content07__desc { color:#ddd; font-size:15px; margin-bottom:26px }
.p-index-content07__btn .p-btn { background:#f4ab00; color:#000 }
.p-index-content07__btn .p-btn:hover { background:#ffca28; opacity:1 }

/* ============ NEWS + TOPICS section ============ */

.p-index-content04 { background:#f3f3f3; padding:58px 0 }
.p-index-content04__inner { display:flex; gap:46px }
.p-index-content04__col { flex:1 }
.p-headline02 { margin-bottom:22px; border-bottom:3px solid #1c4199; padding-bottom:9px }
.p-headline02__title {
  font-size:38px;
  font-family:Arial,'ヒラギノ角ゴ ProN W3','Hiragino Kaku Gothic ProN','メイリオ',Meiryo,sans-serif;
  font-weight:bold
}
.p-headline02__sub { font-size:12px; color:#777 }
.p-index-content04__col--news .p-headline02__title { color:#000000 }
.p-index-content04__col--event .p-headline02__title { color:#1c4199 }

.p-article09 { border-bottom:1px solid #ddd; padding:11px 0 }
.p-article09 a { display:flex; gap:11px; align-items:baseline }
.p-article09__date { font-size:11px; color:#999; white-space:nowrap; flex-shrink:0 }
.p-article09__title { font-size:14px; color:#000; line-height:1.5 }
.p-article09 a:hover .p-article09__title { color:#1c4199 }
.p-index-content04__col-link { margin-top:14px; text-align:right }
.p-index-content04__col--news .p-index-content04__col-link a { color:#000000 }
.p-index-content04__col--news .p-index-content04__col-link a:hover { color:#442602 }
.p-index-content04__col--event .p-index-content04__col-link a { color:#000000 }
.p-index-content04__col--event .p-index-content04__col-link a:hover { color:#1c4199 }

.p-article10 { margin-bottom:12px }
.p-article10 > a { display:flex; gap:10px; align-items:flex-start }
.p-article10__img { width:100px; flex-shrink:0; overflow:hidden; height:63px }
.p-article10__img img {
  width:100%; height:100%; object-fit:cover;
  -webkit-transform:scale(1); transform:scale(1);
  -webkit-transition:-webkit-transform .3s; transition:transform .3s
}
.p-article10 a:hover .p-article10__img img { -webkit-transform:scale(1.1); transform:scale(1.1) }
.p-article10__content {}
.p-article10__title { font-size:13px; color:#1c4199; line-height:1.5; margin-bottom:3px }
.p-article10__date { font-size:11px; color:#999 }

/* ============ FAQ section ============ */

.faq-sect { padding:58px 0; background:#fff }
.faq-sect .section-heading {
  color:#1c4199; font-size:34px;
  font-family:Arial,'ヒラギノ角ゴ ProN W3','Hiragino Kaku Gothic ProN','メイリオ',Meiryo,sans-serif;
  font-weight:bold; margin-bottom:28px;
  border-left:4px solid #f4ab00; padding-left:14px
}
.faq_item { border-bottom:1px solid #d8d8d8; padding:15px 0 }
.faq_item:first-child { border-top:1px solid #d8d8d8 }
.faq_q { font-weight:bold; font-size:14px; margin-bottom:7px; cursor:pointer; color:#000 }
.faq_q:hover { color:#1c4199 }
.faq_a { font-size:14px; color:#444; line-height:1.7 }

/* ============ WHY section ============ */

.why-section { padding:58px 0; background:#f4f4f4 }
.why-section .section-heading {
  color:#1c4199; font-size:34px;
  font-family:Arial,'ヒラギノ角ゴ ProN W3','Hiragino Kaku Gothic ProN','メイリオ',Meiryo,sans-serif;
  font-weight:bold; margin-bottom:26px;
  border-left:4px solid #f4ab00; padding-left:14px
}
.why-grid { display:flex; gap:22px; flex-wrap:wrap }
.why-item {
  flex:1; min-width:240px;
  background:#fff; padding:24px 22px;
  border-top:3px solid #1c4199
}
.why-item__icon { font-size:28px; margin-bottom:10px; color:#1c4199 }
.why-item h3 { font-size:15px; font-weight:bold; margin-bottom:8px }
.why-item p { font-size:13px; color:#555; line-height:1.7 }

/* brands grid — dark bg */
.brands-section { padding:48px 0; background:#000 }
.brands-section .section-heading {
  color:#f4ab00; font-size:28px;
  font-weight:bold; margin-bottom:6px
}
.brands-section .section-sub { color:#999; font-size:14px; margin-bottom:24px }
.brands-grid { display:flex; gap:10px; flex-wrap:wrap }
.brand-chip {
  background:#1a1a1a; padding:14px 22px;
  flex:1; min-width:130px; text-align:center
}
.brand-chip__name { font-size:16px; font-weight:bold; color:#fff; margin-bottom:3px }
.brand-chip__cat { font-size:11px; color:#888 }

/* ============ PAGE HEADER for inner pages ============ */

.p-page-header {
  background:#1c4199; color:#fff;
  padding:78px 20px; text-align:center;
  margin-top:68px
}
.p-page-header__title {
  font-size:34px; font-weight:bold;
  font-family:Arial,'ヒラギノ角ゴ ProN W3','Hiragino Kaku Gothic ProN','メイリオ',Meiryo,sans-serif
}
.p-page-header__desc { font-size:0px }

/* ============ LEGAL pages ============ */

.p-entry__body {
  max-width:900px; margin:58px auto; padding:0 20px;
  font-size:15px; line-height:1.9; color:#222
}
.p-entry__body h2 {
  color:#1c4199; font-size:21px; margin:34px 0 11px;
  border-left:4px solid #1c4199; padding-left:13px
}
.p-entry__body h3 { font-size:17px; margin:22px 0 7px; font-weight:bold }
.p-entry__body p { margin-bottom:15px }
.p-entry__body ul { margin:10px 0 15px 20px; list-style:disc }
.p-entry__body ul li { margin-bottom:5px }

/* imprint section */
.imprint-block {
  background:#f5f5f5; padding:22px 24px; margin:22px 0;
  border-left:4px solid #1c4199; font-size:14px; line-height:1.9
}

/* ============ CHECKOUT page ============ */

.checkoutWrap { max-width:900px; margin:58px auto; padding:0 20px }
.checkoutWrap > h2 {
  color:#1c4199; font-size:26px; font-weight:bold;
  margin-bottom:28px; padding-bottom:11px; border-bottom:2px solid #1c4199
}
.checkoutLayout { display:flex; gap:38px; align-items:flex-start }
.checkoutForm { flex:1 }
.checkoutSummary {
  width:310px; flex-shrink:0;
  background:#f5f5f5; padding:22px
}
.form-group { margin-bottom:16px }
.form-group label {
  display:block; font-size:13px; font-weight:bold;
  margin-bottom:5px; color:#333
}
.form-group input,
.form-group select,
.form-group textarea {
  width:100%; border:1px solid #ccc;
  padding:9px 11px; font-size:14px; background:#fff
}
.form-group input:focus,
.form-group select:focus,
.form-group textarea:focus {
  outline:none; border-color:#1c4199
}
.form-group textarea { height:95px; resize:vertical }
.form-row { display:flex; gap:14px }
.form-row .form-group { flex:1 }
.checkoutSummary h3 {
  font-size:15px; font-weight:bold; color:#1c4199;
  margin-bottom:14px; padding-bottom:7px; border-bottom:2px solid #1c4199
}
.checkoutSummary__item {
  display:flex; justify-content:space-between;
  font-size:13px; padding:7px 0; border-bottom:1px solid #ddd
}
.checkoutSummary__total {
  display:flex; justify-content:space-between;
  font-size:16px; font-weight:bold; margin-top:14px; padding-top:11px
}
.checkoutSubmit {
  background:#1c4199; color:#fff; border:none;
  width:100%; padding:14px; font-size:15px;
  cursor:pointer; font-weight:bold; margin-top:18px
}
.checkoutSubmit:hover { background:#163285 }

/* payment method chooser */
.pay-methods { display:flex; gap:10px; margin-bottom:18px }
.pay-option {
  flex:1; border:2px solid #ddd;
  padding:12px; text-align:center; cursor:pointer; font-size:13px
}
.pay-option.active { border-color:#1c4199; background:#e8edfa }

/* ============ FOOTER ============ */

.l-footer { background:#fff }

.p-info { background:#ffffff; color:#000000; padding:38px 0 }
.p-info__inner {
  max-width:1200px; margin:0 auto; padding:0 20px;
  display:flex; gap:38px; align-items:flex-start; flex-wrap:wrap
}
.p-info__logo img { height:46px; width:auto }
.p-info__address { font-size:13px; line-height:1.9; color:#444; margin-top:6px }
.p-info__address a { color:#1c4199 }
.p-info__address a:hover { color:#f4ab00 }

.footer-social { display:flex; gap:9px; margin-top:12px }
.footer-social a {
  display:inline-flex; align-items:center; justify-content:center;
  width:34px; height:34px;
  background:#1c4199; color:#fff; font-size:14px; font-weight:bold;
  -webkit-transition:background .2s; transition:background .2s
}
.footer-social a:hover { background:#f4ab00; color:#000 }
.footer-social svg { width:16px; height:16px; fill:currentColor }

.p-footer-nav {
  background:#f4f4f4; color:#1c4199;
  display:flex; flex-wrap:wrap; justify-content:center; gap:0;
  padding:13px 20px
}
.p-footer-nav a { color:#1c4199; padding:4px 13px; font-size:12px; border-right:1px solid #ccc }
.p-footer-nav a:hover { color:#f4ab00 }
.p-footer-nav li:last-child a { border-right:none }

.p-copyright { background:#000000; text-align:center; padding:13px 20px }
.p-copyright small { color:#fff; font-size:11px }

/* pagetop btn */
.p-pagetop {
  position:fixed; bottom:28px; right:22px;
  background:#1c4199; color:#fff;
  width:42px; height:42px;
  border:none; cursor:pointer; font-size:20px;
  display:none; align-items:center; justify-content:center; z-index:400
}
.p-pagetop.is-show { display:flex }

.l-main { margin-top:0 }

/* ============ RESPONSIVE — tablet breakpoint ============ */

@media screen and (max-width:1199px) {

.l-header { background:#1c4199 }
.l-header--fixed.is-active { background:#1c4199 }

.p-menu-btn { display:flex }

.p-global-nav {
  background:rgba(0,0,0,1);
  position:fixed; top:0; right:-100%;
  width:280px; height:100vh;
  z-index:600;
  -webkit-transition:right .3s; transition:right .3s;
  overflow-y:auto; padding-top:60px
}
.p-global-nav.is-open { right:0 }
.p-global-nav > ul { flex-direction:column; gap:0 }
.p-global-nav > ul > li > a,
.p-global-nav > ul > li > a:hover,
.p-global-nav .sub-menu a,
.p-global-nav .sub-menu a:hover { color:#ffffff!important }
.p-global-nav .sub-menu { position:static; display:block; background:#111 }

.p-index-content02,
.p-index-content02--rev { flex-direction:column }
.p-index-content02--rev { flex-direction:column }

.checkoutLayout { flex-direction:column }
.checkoutSummary { width:100% }

.why-grid { gap:14px }
.brands-grid { gap:8px }

}

/* mobile */
@media screen and (max-width:767px) {

.p-header-content__title { font-size:22px }
.p-index-content01__title { font-size:24px }
.p-index-content01 { padding:42px 0 }
.p-index-content02__title { font-size:24px }
.p-index-content06__title { font-size:22px }
.p-index-content07__title { font-size:22px }
.p-index-content07 { padding:64px 0 }
.p-headline02__title { font-size:26px }

.p-index-content04__inner { flex-direction:column }
.p-plan-list { flex-direction:column }
.shopGrid .prodCard { min-width:calc(50% - 9px); max-width:calc(50% - 9px) }

.p-page-header { padding:54px 20px }
.p-page-header__title { font-size:24px }
.p-page-header__desc { font-size:0px }

.cartDrop { width:100%; right:-100% }
.cartDrop.is-open { right:0 }

.form-row { flex-direction:column; gap:0 }

.cartBar__msg { display:none }
.cartBar__inner { justify-content:flex-end }

.footer-social { gap:7px }

}

@media screen and (max-width:480px) {
.shopGrid .prodCard { min-width:100%; max-width:100% }
.p-index-content03 { flex-direction:column }
.p-index-content03__item { min-width:100% }
}

/* ============ HERO gap fix — cartBar + header ============ */
/* cartBar ~36px + header 68px = 104px total fixed height */
.p-header-content {
  padding-top:0;
}
/* hero already has margin-top:0 via inline style on index */
/* other pages use margin-top:68px on p-page-header */

/* ============ GDPR COOKIE BANNER ============ */

.cookieBanner {
  position:fixed;
  bottom:0; left:0; right:0;
  background:#1c1c1c;
  color:#fff;
  z-index:8000;
  padding:14px 20px;
  box-shadow:0 -2px 12px rgba(0,0,0,.3)
}
.cookieBanner__inner {
  max-width:1200px;
  margin:0 auto;
  display:flex;
  gap:20px;
  align-items:center;
  flex-wrap:wrap
}
.cookieBanner__text { flex:1; min-width:240px }
.cookieBanner__text strong { font-size:14px; display:block; margin-bottom:4px }
.cookieBanner__text p { font-size:12px; color:#ccc; line-height:1.5; margin:0 }
.cookieBanner__text a { color:#f4ab00; text-decoration:underline }
.cookieBanner__btns { display:flex; gap:9px; flex-shrink:0 }
.cookieBanner__accept {
  background:#f4ab00; color:#000;
  border:none; padding:9px 20px;
  font-size:13px; font-weight:bold; cursor:pointer
}
.cookieBanner__accept:hover { background:#ffca28 }
.cookieBanner__settings {
  background:transparent; color:#ccc;
  border:1px solid #555; padding:9px 16px;
  font-size:13px; cursor:pointer
}
.cookieBanner__settings:hover { border-color:#fff; color:#fff }

/* Cookie settings panel */
.cookiePanel {
  position:fixed; inset:0;
  z-index:9000;
  display:flex;
  align-items:center;
  justify-content:center
}
.cookiePanel__overlay {
  position:absolute; inset:0;
  background:rgba(0,0,0,.55)
}
.cookiePanel__box {
  position:relative; z-index:1;
  background:#fff;
  width:100%; max-width:480px;
  margin:16px;
  box-shadow:0 4px 24px rgba(0,0,0,.25)
}
.cookiePanel__head {
  background:#1c4199; color:#fff;
  padding:14px 18px;
  display:flex; justify-content:space-between; align-items:center
}
.cookiePanel__head h3 { font-size:15px; font-weight:bold }
.cookiePanel__close {
  background:none; border:none; color:#fff;
  font-size:18px; cursor:pointer; line-height:1
}
.cookiePanel__body { padding:16px 18px }
.cookiePanel__item {
  display:flex; justify-content:space-between; align-items:flex-start;
  gap:14px; padding:13px 0; border-bottom:1px solid #eee
}
.cookiePanel__item:last-child { border-bottom:none }
.cookiePanel__item strong { font-size:13px; display:block; margin-bottom:3px }
.cookiePanel__item p { font-size:12px; color:#666; line-height:1.5; margin:0 }
.cookiePanel__toggle--on { font-size:11px; color:#888; white-space:nowrap; flex-shrink:0; padding-top:2px }
.cookiePanel__foot { padding:14px 18px; border-top:1px solid #eee }

/* toggle switch */
.cookiePanel__switch { position:relative; display:inline-block; width:40px; height:22px; flex-shrink:0; margin-top:2px }
.cookiePanel__switch input { opacity:0; width:0; height:0 }
.cookiePanel__slider {
  position:absolute; inset:0;
  background:#ccc; cursor:pointer;
  -webkit-transition:.3s; transition:.3s;
  border-radius:22px
}
.cookiePanel__slider::before {
  content:''; position:absolute;
  height:16px; width:16px;
  left:3px; bottom:3px;
  background:#fff;
  -webkit-transition:.3s; transition:.3s;
  border-radius:50%
}
.cookiePanel__switch input:checked + .cookiePanel__slider { background:#1c4199 }
.cookiePanel__switch input:checked + .cookiePanel__slider::before { -webkit-transform:translateX(18px); transform:translateX(18px) }

/* ============ MOBILE IMPROVEMENTS ============ */

@media screen and (max-width:900px) {
  .p-plan-list { gap:14px }
  .p-plan-list__item { min-width:calc(50% - 9px); flex-basis:calc(50% - 9px) }
  .why-grid { gap:14px }
  .why-item { min-width:calc(50% - 11px); flex-basis:calc(50% - 11px) }
}

@media screen and (max-width:767px) {
  /* banner improvements */
  .cookieBanner__inner { flex-direction:column; gap:12px; align-items:flex-start }
  .cookieBanner__btns { width:100%; justify-content:flex-start }

  /* hero */
  .p-header-content { height:38vh; min-height:220px }
  .p-header-content__inner { padding:24px 18px }

  /* cards to 2 col */
  .p-plan-list { gap:11px }
  .p-plan-list__item { min-width:calc(50% - 6px); flex-basis:calc(50% - 6px) }

  /* why items */
  .why-item { min-width:100%; flex-basis:100% }

  /* brand chips */
  .brand-chip { min-width:calc(50% - 6px); flex-basis:calc(50% - 6px) }

  /* category cards */
  .p-index-content03 { flex-direction:column }

  /* nav toggle */
  .p-global-nav__toggle { display:inline-block; margin-left:4px }

  /* FAQ */
  .faq_item { padding:12px 0 }
  .faq_q { font-size:13px }
  .faq_a { font-size:13px }

  /* section headings */
  .section-heading { font-size:24px !important }

  /* index content06 padding */
  .p-index-content06 { padding:38px 0 }
  .p-cb__item { padding:38px 0 }
  .p-index-content01 { padding:32px 0 }
}

@media screen and (max-width:480px) {
  .p-plan-list__item { min-width:100%; flex-basis:100% }
  .brand-chip { min-width:calc(50% - 5px) }
  .cartBar__count { width:17px; height:17px; font-size:9px }
  .p-header-content__title { font-size:18px }
  .p-index-content01__title { font-size:20px }
  .prodCard__name { font-size:13px }
}

/* ============ TIPS BLOCK ============ */
.tips-block {
  margin-top:34px;
  padding:26px 28px;
  background:#f3f3f3;
  border-left:4px solid #1c4199
}
.tips-block h3 {
  font-size:18px;
  color:#1c4199;
  font-weight:bold;
  margin-bottom:14px
}
.tips-block p {
  font-size:14px;
  line-height:1.8;
  color:#333;
  margin-bottom:13px
}
.tips-block p:last-child { margin-bottom:0 }

@media screen and (max-width:767px) {
  .tips-block { padding:18px 16px }
  .tips-block h3 { font-size:16px }
  .tips-block p { font-size:13px }
}
