:root{
  --yf-blue:#0b63b6;
  --yf-blue-dark:#0c447a;
  --yf-green:#55b62d;
  --yf-green-dark:#2e8c20;
  --yf-border:#dfeaf3;
  --yf-text:#17324d;
  --yf-muted:#70869a;
  --yf-white:#fff;
}

/* Phase v0.1 intentionally affects header only. */
.yf-header{
  background:#fff;
  border-bottom:1px solid var(--yf-border);
  position:relative;
  z-index:50;
}
.yf-header__inner{
  width:min(1500px, calc(100% - 48px));
  min-height:96px;
  margin:0 auto;
  display:grid;
  grid-template-columns:300px minmax(560px,1fr) auto;
  align-items:center;
  gap:28px;
}
.yf-brand{
  display:flex;
  align-items:center;
  height:78px;
  overflow:visible;
}
.yf-brand img{
  display:block;
  width:290px;
  max-width:100%;
  max-height:76px;
  object-fit:contain;
  object-position:left center;
}
.yf-nav{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:26px;
  white-space:nowrap;
}
.yf-nav a{
  color:var(--yf-blue-dark);
  font-weight:700;
  font-size:14px;
  line-height:1;
  text-decoration:none;
  padding:39px 0 37px;
  border-bottom:3px solid transparent;
}
.yf-nav a:hover,
.yf-nav a:focus{
  color:var(--yf-green-dark);
  border-bottom-color:var(--yf-green);
}
.yf-actions{
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:18px;
  min-width:390px;
}
.yf-search{
  width:240px;
  height:46px;
  display:grid;
  grid-template-columns:1fr 46px;
  border:1px solid #cfdfea;
  border-radius:10px;
  overflow:hidden;
  background:#fff;
  margin:0;
}
.yf-search input[type="search"]{
  border:0!important;
  box-shadow:none!important;
  background:transparent!important;
  min-width:0;
  width:100%;
  padding:0 14px!important;
  margin:0!important;
  color:var(--yf-text);
  font-size:14px;
  height:44px;
}
.yf-search button{
  border:0;
  background:#fff;
  color:var(--yf-blue-dark);
  display:grid;
  place-items:center;
  padding:0;
  margin:0;
  cursor:pointer;
}
.yf-search button:hover{background:#f4faf2;color:var(--yf-green-dark);}
.yf-search svg,
.yf-action svg{
  width:22px;
  height:22px;
  fill:none;
  stroke:currentColor;
  stroke-width:1.8;
  stroke-linecap:round;
  stroke-linejoin:round;
}
.yf-action{
  min-width:48px;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:4px;
  color:var(--yf-blue-dark);
  text-decoration:none!important;
  font-size:11px;
  font-weight:700;
  line-height:1;
}
.yf-action:hover{color:var(--yf-green-dark);}
.yf-cart__icon{position:relative;display:flex;}
.yf-cart__count{
  position:absolute;
  top:-10px;
  right:-12px;
  min-width:19px;
  height:19px;
  border-radius:999px;
  display:grid;
  place-items:center;
  background:var(--yf-green);
  color:#fff;
  font-size:10px;
  font-weight:800;
  padding:0 5px;
}

/* Neutralize Storefront header remnants when child header is used. */
.site-header,
.storefront-primary-navigation{display:none!important;}

@media (max-width:1280px){
  .yf-header__inner{grid-template-columns:250px 1fr auto;gap:18px;width:min(1200px,calc(100% - 36px));}
  .yf-brand img{width:240px;}
  .yf-nav{gap:16px;}
  .yf-nav a{font-size:13px;}
  .yf-actions{min-width:300px;gap:12px;}
  .yf-search{width:185px;}
}

@media (max-width:1024px){
  .yf-header__inner{grid-template-columns:220px 1fr;min-height:88px;}
  .yf-brand img{width:210px;}
  .yf-nav{display:none;}
  .yf-actions{min-width:0;justify-content:flex-end;}
}

@media (max-width:680px){
  .yf-header__inner{width:calc(100% - 24px);grid-template-columns:1fr auto;gap:10px;min-height:78px;}
  .yf-brand{height:66px;}
  .yf-brand img{width:190px;max-height:62px;}
  .yf-search{display:none;}
  .yf-actions{gap:14px;}
  .yf-action span:last-child{display:none;}
}


/* Phase v0.2: Product mega menu only. Existing v0.1 header layout remains unchanged. */
.yf-product-nav{
  position:relative;
  display:flex;
  align-items:stretch;
  align-self:stretch;
}
.yf-product-nav > .yf-product-trigger{
  display:flex;
  align-items:center;
  gap:5px;
}
.yf-product-caret{
  font-size:11px;
  color:var(--yf-green-dark);
  transform:translateY(-1px);
}
.yf-mega-menu{
  position:absolute;
  top:calc(100% - 1px);
  left:50%;
  transform:translateX(-38%);
  width:min(900px, 72vw);
  background:#fff;
  border:1px solid var(--yf-border);
  border-radius:0 0 16px 16px;
  box-shadow:0 18px 45px rgba(19,60,91,.16);
  padding:20px 20px 0;
  opacity:0;
  visibility:hidden;
  pointer-events:none;
  transition:opacity .16s ease, visibility .16s ease, transform .16s ease;
  z-index:999;
}
.yf-product-nav:hover .yf-mega-menu,
.yf-product-nav:focus-within .yf-mega-menu{
  opacity:1;
  visibility:visible;
  pointer-events:auto;
  transform:translateX(-38%) translateY(0);
}
.yf-mega-grid{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:0;
}
.yf-mega-item{
  display:flex!important;
  align-items:center;
  gap:14px;
  min-height:110px;
  padding:18px 16px!important;
  border:0!important;
  border-right:1px solid #edf3f7!important;
  border-bottom:1px solid #edf3f7!important;
  text-decoration:none!important;
  color:var(--yf-blue-dark)!important;
  background:#fff;
}
.yf-mega-item:nth-child(4n){border-right:0!important;}
.yf-mega-item:nth-child(n+5){border-bottom:0!important;}
.yf-mega-item:hover,
.yf-mega-item:focus{
  background:#f7fbf5;
  color:var(--yf-green-dark)!important;
}
.yf-mega-icon{
  flex:0 0 52px;
  width:52px;
  height:52px;
  border-radius:50%;
  display:grid;
  place-items:center;
  background:#f2f9ee;
  font-size:29px;
  line-height:1;
}
.yf-mega-icon img{
  display:block;
  width:100%;
  height:100%;
  object-fit:cover;
  border-radius:50%;
}
.yf-mega-item > span:last-child{
  display:flex;
  flex-direction:column;
  gap:5px;
  min-width:0;
}
.yf-mega-item strong{
  font-size:14px;
  line-height:1.2;
  color:inherit;
  font-weight:800;
}
.yf-mega-item small{
  display:block;
  color:var(--yf-muted);
  font-size:11px;
  line-height:1.35;
  font-weight:500;
}
.yf-mega-footer{
  margin:0 -20px;
  border-top:1px solid var(--yf-border);
  background:#f8fbfd;
  border-radius:0 0 16px 16px;
  padding:13px 20px;
  text-align:right;
}
.yf-mega-footer a{
  display:inline-block!important;
  padding:0!important;
  border:0!important;
  color:var(--yf-blue)!important;
  font-weight:800;
  font-size:13px!important;
  text-decoration:none!important;
}
.yf-mega-footer a:hover{color:var(--yf-green-dark)!important;}

@media (max-width:1280px){
  .yf-mega-menu{width:min(780px,76vw);transform:translateX(-36%);}
  .yf-product-nav:hover .yf-mega-menu,
  .yf-product-nav:focus-within .yf-mega-menu{transform:translateX(-36%);}
  .yf-mega-item{min-height:100px;padding:15px 12px!important;gap:10px;}
  .yf-mega-icon{flex-basis:44px;width:44px;height:44px;font-size:24px;}
  .yf-mega-item strong{font-size:13px;}
}

@media (max-width:1024px){
  /* Primary nav is intentionally hidden by v0.1 at this breakpoint, so mega menu follows it. */
  .yf-mega-menu{display:none;}
}

/* v0.2.1 icon-only refinement: layout intentionally unchanged. */
.yf-mega-icon .yf-cat-svg{
  width:30px;
  height:30px;
  fill:none;
  stroke:var(--yf-green-dark);
  stroke-width:2.4;
  stroke-linecap:round;
  stroke-linejoin:round;
}


/* Phase v0.3: Homepage hero section only. Header and mega menu remain unchanged. */
.yf-hero{
  background:linear-gradient(180deg,#f7fbff 0%, #ffffff 100%);
  border-bottom:1px solid var(--yf-border);
}
.yf-hero__inner{
  width:min(1500px, calc(100% - 48px));
  margin:0 auto;
  display:grid;
  grid-template-columns:minmax(420px, 1fr) minmax(520px, 780px);
  gap:26px;
  align-items:stretch;
  padding:28px 0 26px;
}
.yf-hero__content{
  background:#f3f9ff;
  border:1px solid #dceaf7;
  border-radius:28px;
  padding:42px 38px;
  display:flex;
  flex-direction:column;
  justify-content:center;
}
.yf-hero__eyebrow{
  display:inline-flex;
  align-self:flex-start;
  align-items:center;
  gap:8px;
  padding:10px 16px;
  border-radius:999px;
  border:1px solid #cfe6bf;
  background:#f4fbef;
  color:var(--yf-green-dark);
  font-weight:800;
  font-size:14px;
  line-height:1;
  margin-bottom:24px;
}
.yf-hero__title{
  margin:0 0 18px;
  color:var(--yf-blue-dark);
  font-size:64px;
  line-height:0.96;
  font-weight:800;
  letter-spacing:-0.03em;
}
.yf-hero__title span{
  color:var(--yf-green-dark);
}
.yf-hero__text{
  margin:0 0 28px;
  color:#4a6279;
  font-size:22px;
  line-height:1.6;
  max-width:680px;
}
.yf-hero__actions{
  display:flex;
  flex-wrap:wrap;
  gap:14px;
  margin-bottom:30px;
}
.yf-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:52px;
  padding:0 24px;
  border-radius:12px;
  text-decoration:none!important;
  font-size:15px;
  font-weight:800;
  border:1px solid transparent;
  transition:all .18s ease;
}
.yf-btn--primary{
  background:var(--yf-blue);
  color:#fff;
}
.yf-btn--primary:hover{background:#09539a;color:#fff;}
.yf-btn--secondary{
  background:#fff;
  color:var(--yf-green-dark);
  border-color:#9bd27c;
}
.yf-btn--secondary:hover{background:#f6fcf1;color:#246d1a;}
.yf-hero__points{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:14px;
}
.yf-point{
  padding:0 14px 0 18px;
  border-left:3px solid #d8e9f8;
}
.yf-point strong{
  display:block;
  color:var(--yf-blue-dark);
  font-size:14px;
  line-height:1.25;
  font-weight:800;
  margin-bottom:4px;
}
.yf-point span{
  display:block;
  color:var(--yf-muted);
  font-size:12px;
  line-height:1.45;
}
.yf-hero__media{
  position:relative;
  min-height:560px;
  border-radius:28px;
  overflow:hidden;
  border:1px solid #dceaf7;
  background:#dfeef8;
}
.yf-hero__media img{
  width:100%;
  height:100%;
  display:block;
  object-fit:cover;
}
body.home .page .entry-title,
body.home .type-page .entry-title,
body.home .page-header{display:none!important;}
body.home .content-area, body.home .widget-area{width:100%!important;float:none!important;margin:0!important;}
body.home.right-sidebar .content-area{width:100%!important;}
@media (max-width:1280px){
  .yf-hero__inner{width:min(1200px, calc(100% - 36px));grid-template-columns:minmax(380px,1fr) minmax(420px,640px);}
  .yf-hero__title{font-size:54px;}
  .yf-hero__text{font-size:18px;}
  .yf-hero__media{min-height:500px;}
}
@media (max-width:1024px){
  .yf-hero__inner{grid-template-columns:1fr;gap:18px;padding:22px 0;}
  .yf-hero__content{padding:34px 28px;}
  .yf-hero__title{font-size:46px;}
  .yf-hero__points{grid-template-columns:1fr;}
  .yf-hero__media{min-height:420px;}
}
@media (max-width:680px){
  .yf-hero__inner{width:calc(100% - 24px);}
  .yf-hero__content{padding:28px 20px;border-radius:22px;}
  .yf-hero__eyebrow{font-size:12px;padding:9px 12px;margin-bottom:18px;}
  .yf-hero__title{font-size:36px;}
  .yf-hero__text{font-size:16px;margin-bottom:22px;}
  .yf-hero__actions{flex-direction:column;align-items:stretch;}
  .yf-btn{width:100%;}
  .yf-hero__media{min-height:320px;border-radius:22px;}
}


/* v0.3.5 — approved hero image + single tagline overlay only. */
.yf-hero__tagline{
  position:absolute;
  right:76px;
  bottom:38px;
  width:230px;
  min-height:230px;
  border-radius:50%;
  box-sizing:border-box;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:30px;
  text-align:center;
  background:rgba(255,255,255,.96);
  border:2px solid rgba(0,153,230,.32);
  box-shadow:0 14px 32px rgba(17,66,104,.16);
  color:#0a8fd8;
  font-size:20px;
  line-height:1.22;
  font-weight:900;
  letter-spacing:.01em;
  z-index:3;
}
@media (max-width:1280px){
  .yf-hero__tagline{
    right:58px;
    bottom:30px;
    width:196px;
    min-height:196px;
    padding:24px;
    font-size:16px;
  }
}
@media (max-width:1024px){
  .yf-hero__tagline{
    right:42px;
    bottom:24px;
    width:168px;
    min-height:168px;
    padding:21px;
    font-size:14px;
  }
}
@media (max-width:680px){
  .yf-hero__tagline{
    right:20px;
    bottom:16px;
    width:126px;
    min-height:126px;
    padding:15px;
    font-size:10px;
  }
}


/* v0.4.1 — compact category strip + Fresh Picks / Journal row only. */
.yf-home-categories{background:#fff;padding:0 0 28px;}
.yf-home-shell{width:min(1500px,calc(100% - 48px));margin:0 auto;}
.yf-category-strip{position:relative;margin-top:-12px;background:#fff;border:1px solid #e5edf4;border-radius:22px;box-shadow:0 10px 28px rgba(27,74,110,.08);padding:16px 22px;display:grid;grid-template-columns:repeat(8,minmax(0,1fr));gap:8px;z-index:4;}
.yf-category-pill{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;min-width:0;padding:5px;text-decoration:none!important;color:var(--yf-blue-dark)!important;border-radius:14px;transition:background .16s ease,transform .16s ease;}
.yf-category-pill:hover{background:#f7fbf5;transform:translateY(-1px);}
.yf-category-photo{width:76px;height:58px;border-radius:50%;display:block;overflow:hidden;background:#f5f9f2;}
.yf-category-photo img{width:100%;height:100%;display:block;object-fit:cover;}
.yf-category-name{font-size:12px;font-weight:800;text-align:center;line-height:1.25;white-space:normal;}
.yf-home-feature-row{display:grid;grid-template-columns:1.05fr .95fr;gap:34px;margin-top:26px;}
.yf-fresh-picks,.yf-journal-preview{min-width:0;}
.yf-section-heading{display:flex;align-items:flex-start;justify-content:space-between;gap:18px;margin-bottom:14px;}
.yf-section-heading h2{margin:0;color:var(--yf-blue-dark);font-size:27px;line-height:1.1;font-weight:800;letter-spacing:-.02em;}
.yf-section-heading h2 span{color:var(--yf-green);font-size:15px;vertical-align:top;}
.yf-section-heading p{margin:5px 0 0;color:#587086;font-size:13px;line-height:1.4;}
.yf-section-heading>a{color:var(--yf-green-dark)!important;text-decoration:none!important;font-size:12px;font-weight:800;white-space:nowrap;margin-top:7px;}
.yf-product-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;}
.yf-product-card{border:1px solid #dfe8ef;border-radius:12px;background:#fff;overflow:hidden;min-width:0;box-shadow:0 3px 10px rgba(29,70,102,.04);}
.yf-product-photo{display:block;height:146px;background:#fbfcfd;overflow:hidden;}
.yf-product-photo img{width:100%;height:100%;object-fit:contain;display:block;padding:8px;box-sizing:border-box;}
.yf-product-body{padding:10px 11px 12px;}
.yf-fresh-label{display:inline-block;background:#eff9ea;color:var(--yf-green-dark);border-radius:999px;padding:3px 8px;font-size:9px;font-weight:800;margin-bottom:6px;}
.yf-product-body h3{font-size:12px;line-height:1.3;margin:0 0 4px;color:var(--yf-blue-dark);font-weight:800;}
.yf-product-body h3 a{color:inherit!important;text-decoration:none!important;}
.yf-product-body small{display:block;color:#72879a;font-size:10px;margin-bottom:8px;}
.yf-product-meta{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-top:8px;color:var(--yf-blue-dark);font-size:12px;font-weight:800;}
.yf-mini-cart{width:29px;height:29px;border-radius:6px;background:#27a82e;color:#fff!important;display:grid;place-items:center;text-decoration:none!important;font-size:17px;line-height:1;}
.yf-journal-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;}
.yf-journal-card{border:1px solid #dfe8ef;border-radius:12px;background:#fff;overflow:hidden;min-width:0;box-shadow:0 3px 10px rgba(29,70,102,.04);}
.yf-journal-photo{display:block;height:150px;overflow:hidden;background:#f2f6f8;}
.yf-journal-photo img{width:100%;height:100%;object-fit:cover;display:block;}
.yf-journal-body{padding:10px 11px 12px;}
.yf-journal-body small{font-size:9px;color:#7a8d9f;display:block;margin-bottom:6px;}
.yf-journal-body h3{font-size:13px;line-height:1.3;margin:0 0 9px;color:var(--yf-blue-dark);font-weight:800;}
.yf-journal-body h3 a{color:inherit!important;text-decoration:none!important;}
.yf-read-more{color:var(--yf-green-dark)!important;text-decoration:none!important;font-size:10px;font-weight:800;}
@media(max-width:1280px){.yf-home-shell{width:min(1200px,calc(100% - 36px));}.yf-category-photo{width:66px;height:52px}.yf-category-name{font-size:11px}.yf-home-feature-row{grid-template-columns:1fr;}.yf-product-photo{height:158px}.yf-journal-photo{height:170px}}
@media(max-width:900px){.yf-category-strip{grid-template-columns:repeat(4,minmax(0,1fr));row-gap:14px}.yf-product-grid{grid-template-columns:repeat(2,minmax(0,1fr));}.yf-journal-grid{grid-template-columns:repeat(3,minmax(0,1fr));}}
@media(max-width:680px){.yf-home-shell{width:calc(100% - 24px)}.yf-category-strip{grid-template-columns:repeat(2,minmax(0,1fr));padding:14px}.yf-category-photo{width:72px;height:56px}.yf-home-feature-row{gap:26px}.yf-section-heading{align-items:flex-end}.yf-section-heading h2{font-size:23px}.yf-product-grid,.yf-journal-grid{grid-template-columns:1fr 1fr}.yf-journal-grid .yf-journal-card:last-child{display:none}.yf-product-photo,.yf-journal-photo{height:132px}}


/* v0.4.2 — Fresh Picks interaction only: entire card is clickable. */
.yf-product-card{
  position:relative;
  cursor:pointer;
  transition:transform .16s ease, box-shadow .16s ease, border-color .16s ease;
}
.yf-product-card:hover{
  transform:translateY(-2px);
  box-shadow:0 8px 22px rgba(29,70,102,.10);
  border-color:#c9dce9;
}
.yf-product-card__link{
  position:absolute;
  inset:0;
  z-index:2;
  display:block;
  border-radius:12px;
  text-indent:-9999px;
  overflow:hidden;
}
.yf-product-card .yf-mini-cart{
  position:relative;
  z-index:3;
}
.yf-product-card__link:focus{
  outline:3px solid rgba(11,99,182,.28);
  outline-offset:2px;
}


/* v0.4 FINAL — full-width hero, clear image, mirrored photo. */
.yf-hero--full{background:#eaf5fb;border-bottom:1px solid var(--yf-border);padding:0;}
.yf-hero--full .yf-hero__inner{position:relative;width:100%;max-width:none;min-height:585px;margin:0;padding:0;display:block;overflow:hidden;}
.yf-hero--full .yf-hero__media{position:absolute;inset:0;min-height:0;border:0;border-radius:0;overflow:hidden;background:#dfeef8;z-index:0;}
.yf-hero--full .yf-hero__media::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(255,255,255,.22) 0%,rgba(255,255,255,.12) 18%,rgba(255,255,255,.04) 30%,rgba(255,255,255,0) 44%);pointer-events:none;}
.yf-hero--full .yf-hero__media img{width:100%;height:100%;display:block;object-fit:cover;object-position:center center;opacity:1;filter:none;mix-blend-mode:normal;transform:scaleX(-1);}
.yf-hero--full .yf-hero__content{position:relative;z-index:2;width:min(1500px,calc(100% - 48px));min-height:585px;margin:0 auto;padding:62px 0 36px;background:transparent;border:0;border-radius:0;display:flex;flex-direction:column;justify-content:center;align-items:flex-start;box-sizing:border-box;}
.yf-hero--full .yf-hero__eyebrow{margin-bottom:22px;background:rgba(255,255,255,.91);border-color:#a9d990;}
.yf-hero--full .yf-hero__title{max-width:640px;margin-bottom:18px;font-size:64px;line-height:.98;text-shadow:0 1px 0 rgba(255,255,255,.7);}
.yf-hero--full .yf-hero__text{max-width:620px;margin-bottom:26px;color:#314e68;font-size:20px;line-height:1.55;}
.yf-hero--full .yf-hero__actions{margin-bottom:24px;}
.yf-hero--full .yf-hero__tagline{position:static;width:auto;min-height:0;border-radius:999px;margin:0 0 26px;padding:10px 18px;background:rgba(255,255,255,.92);border:1px solid rgba(7,136,216,.28);box-shadow:0 8px 22px rgba(17,66,104,.10);color:#0788d8;font-size:14px;line-height:1.2;font-weight:900;letter-spacing:.015em;text-align:left;}
.yf-hero--full .yf-hero__points{width:min(650px,100%);grid-template-columns:repeat(3,minmax(0,1fr));gap:0;margin-top:auto;padding:15px 18px;border-radius:16px;background:rgba(255,255,255,.94);border:1px solid rgba(209,226,239,.95);box-shadow:0 10px 28px rgba(17,66,104,.10);}
.yf-hero--full .yf-point{padding:0 18px;border-left:1px solid #d8e9f8;}
.yf-hero--full .yf-point:first-child{border-left:0;padding-left:4px;}
.yf-hero--full .yf-point:last-child{padding-right:4px;}
@media (max-width:1280px){
  .yf-hero--full .yf-hero__inner{min-height:540px;}
  .yf-hero--full .yf-hero__content{width:min(1200px,calc(100% - 36px));min-height:540px;padding:52px 0 30px;}
  .yf-hero--full .yf-hero__title{font-size:54px;max-width:560px;}
  .yf-hero--full .yf-hero__text{font-size:18px;max-width:540px;}
}
@media (max-width:1024px){
  .yf-hero--full .yf-hero__inner{min-height:620px;}
  .yf-hero--full .yf-hero__content{width:calc(100% - 36px);min-height:620px;padding:42px 0 28px;}
  .yf-hero--full .yf-hero__media::after{background:linear-gradient(90deg,rgba(255,255,255,.28) 0%,rgba(255,255,255,.14) 28%,rgba(255,255,255,.04) 48%,rgba(255,255,255,0) 62%);}
  .yf-hero--full .yf-hero__title{font-size:46px;max-width:520px;}
  .yf-hero--full .yf-hero__points{grid-template-columns:1fr;gap:12px;width:min(430px,100%);}
  .yf-hero--full .yf-point,.yf-hero--full .yf-point:first-child,.yf-hero--full .yf-point:last-child{border-left:3px solid #d8e9f8;padding:0 0 0 14px;}
}
@media (max-width:680px){
  .yf-hero--full .yf-hero__inner{min-height:680px;}
  .yf-hero--full .yf-hero__content{width:calc(100% - 24px);min-height:680px;padding:34px 0 22px;justify-content:flex-start;}
  .yf-hero--full .yf-hero__media img{object-position:42% center;}
  .yf-hero--full .yf-hero__media::after{background:linear-gradient(180deg,rgba(255,255,255,.26) 0%,rgba(255,255,255,.12) 30%,rgba(255,255,255,.03) 48%,rgba(255,255,255,0) 62%);}
  .yf-hero--full .yf-hero__title{font-size:38px;max-width:100%;}
  .yf-hero--full .yf-hero__text{font-size:16px;max-width:100%;}
  .yf-hero--full .yf-hero__actions{width:100%;}
  .yf-hero--full .yf-hero__tagline{font-size:11px;padding:9px 13px;margin-bottom:18px;}
  .yf-hero--full .yf-hero__points{width:100%;margin-top:auto;}
}

/* v0.5 — WHY YOGYA FRESH SECTION ONLY.
   Existing locked sections remain unchanged. */
.yf-why{
  background:#ffffff;
  padding:34px 0 18px;
}
.yf-why__inner{
  width:min(1500px, calc(100% - 48px));
  margin:0 auto;
}
.yf-why__head{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  margin-bottom:18px;
}
.yf-section-kicker{
  display:inline-block;
  color:var(--yf-green-dark);
  font-size:13px;
  font-weight:800;
  margin-bottom:5px;
}
.yf-why__head h2{
  margin:0;
  color:var(--yf-blue-dark);
  font-size:30px;
  line-height:1.15;
  font-weight:800;
  letter-spacing:-.02em;
}
.yf-why__head p{
  margin:7px 0 0;
  max-width:760px;
  color:var(--yf-muted);
  font-size:14px;
  line-height:1.55;
}
.yf-why__grid{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:14px;
}
.yf-why-card{
  display:flex;
  align-items:flex-start;
  gap:14px;
  min-height:150px;
  padding:22px 18px;
  border:1px solid #dfeaf3;
  border-radius:16px;
  background:#fff;
  box-shadow:0 6px 18px rgba(17,66,104,.05);
}
.yf-why-icon{
  flex:0 0 48px;
  width:48px;
  height:48px;
  border-radius:14px;
  background:#f2f9ee;
  color:var(--yf-green-dark);
  display:grid;
  place-items:center;
}
.yf-why-icon svg{
  width:28px;
  height:28px;
  fill:none;
  stroke:currentColor;
  stroke-width:2;
  stroke-linecap:round;
  stroke-linejoin:round;
}
.yf-why-card h3{
  margin:0 0 7px;
  color:var(--yf-blue-dark);
  font-size:16px;
  line-height:1.25;
  font-weight:800;
}
.yf-why-card p{
  margin:0;
  color:#61788d;
  font-size:12px;
  line-height:1.55;
}

@media (max-width:1280px){
  .yf-why__inner{width:min(1200px, calc(100% - 36px));}
  .yf-why__grid{grid-template-columns:repeat(2,minmax(0,1fr));}
}
@media (max-width:680px){
  .yf-why{padding:28px 0 12px;}
  .yf-why__inner{width:calc(100% - 24px);}
  .yf-why__head h2{font-size:25px;}
  .yf-why__grid{grid-template-columns:1fr;}
  .yf-why-card{min-height:0;}
}


/* v0.6 — ACTUAL WEIGHT PACK SECTION ONLY.
   Existing locked sections remain unchanged. */
.yf-weight{
  background:#f7fbff;
  padding:36px 0 20px;
}
.yf-weight__inner{
  width:min(1500px, calc(100% - 48px));
  margin:0 auto;
  display:grid;
  grid-template-columns:minmax(0,1.35fr) minmax(360px,.65fr);
  gap:22px;
  align-items:stretch;
}
.yf-weight__intro,
.yf-weight__example{
  border:1px solid #dfeaf3;
  border-radius:18px;
  background:#fff;
  box-shadow:0 6px 18px rgba(17,66,104,.05);
}
.yf-weight__intro{
  padding:28px 30px;
}
.yf-weight__intro h2{
  margin:0;
  color:var(--yf-blue-dark);
  font-size:32px;
  line-height:1.15;
  font-weight:800;
  letter-spacing:-.02em;
}
.yf-weight__intro > p{
  margin:9px 0 22px;
  max-width:860px;
  color:#61788d;
  font-size:14px;
  line-height:1.65;
}
.yf-weight__steps{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:12px;
}
.yf-weight-step{
  display:flex;
  gap:12px;
  align-items:flex-start;
  padding:16px;
  border:1px solid #e4edf4;
  border-radius:14px;
  background:#fbfdff;
}
.yf-weight-step__num{
  flex:0 0 30px;
  width:30px;
  height:30px;
  border-radius:50%;
  display:grid;
  place-items:center;
  background:var(--yf-blue);
  color:#fff;
  font-size:13px;
  font-weight:800;
}
.yf-weight-step strong{
  display:block;
  color:var(--yf-blue-dark);
  font-size:14px;
  line-height:1.3;
  margin-bottom:4px;
}
.yf-weight-step small{
  display:block;
  color:var(--yf-muted);
  font-size:11px;
  line-height:1.45;
}
.yf-weight__example{
  padding:24px;
  background:linear-gradient(180deg,#ffffff 0%,#f4fbef 100%);
}
.yf-weight__example-head{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:14px;
  padding-bottom:15px;
  margin-bottom:16px;
  border-bottom:1px solid #dfeaf3;
}
.yf-weight__example-head span{
  color:var(--yf-green-dark);
  font-size:12px;
  font-weight:800;
  text-transform:uppercase;
  letter-spacing:.05em;
}
.yf-weight__example-head strong{
  color:var(--yf-blue-dark);
  font-size:18px;
  font-weight:800;
}
.yf-weight__packs{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:10px;
}
.yf-weight-pack{
  border:1px solid #cfe4bd;
  border-radius:14px;
  background:#fff;
  padding:16px 14px;
  text-align:center;
}
.yf-weight-pack strong{
  display:block;
  color:var(--yf-green-dark);
  font-size:22px;
  line-height:1;
  font-weight:900;
  margin-bottom:5px;
}
.yf-weight-pack span{
  display:block;
  color:var(--yf-muted);
  font-size:10px;
  font-weight:700;
}
.yf-weight__note{
  margin-top:14px;
  padding:11px 12px;
  border-radius:10px;
  background:#eef7ff;
  color:#4d6b84;
  font-size:11px;
  line-height:1.45;
  text-align:center;
}

@media (max-width:1280px){
  .yf-weight__inner{
    width:min(1200px, calc(100% - 36px));
    grid-template-columns:1fr;
  }
}
@media (max-width:760px){
  .yf-weight{padding:28px 0 14px;}
  .yf-weight__inner{width:calc(100% - 24px);}
  .yf-weight__intro{padding:22px 20px;}
  .yf-weight__intro h2{font-size:26px;}
  .yf-weight__steps{grid-template-columns:1fr;}
}


/* v0.7 — FINAL HOME SECTIONS ONLY.
   Adds Business Supply, Bundle & Promotion, Delivery Promise/WhatsApp CTA and Footer.
   All previously locked sections remain unchanged. */

.yf-business,
.yf-promo,
.yf-delivery{
  padding:38px 0 20px;
}
.yf-business{background:#fff;}
.yf-promo{background:#f7fbff;}
.yf-delivery{background:#fff;}

.yf-business__inner,
.yf-promo__inner,
.yf-delivery__inner,
.yf-footer__inner,
.yf-footer__bottom{
  width:min(1500px, calc(100% - 48px));
  margin:0 auto;
}

.yf-business__inner{
  display:grid;
  grid-template-columns:minmax(0,1.4fr) minmax(320px,.6fr);
  gap:22px;
}
.yf-business__content,
.yf-business__panel{
  border:1px solid #dfeaf3;
  border-radius:18px;
  background:#fff;
  box-shadow:0 6px 18px rgba(17,66,104,.05);
}
.yf-business__content{padding:30px;}
.yf-business__content h2,
.yf-promo__head h2,
.yf-delivery__message h2{
  margin:0;
  color:var(--yf-blue-dark);
  font-size:32px;
  line-height:1.15;
  font-weight:800;
  letter-spacing:-.02em;
}
.yf-business__content > p,
.yf-promo__head p,
.yf-delivery__message p{
  margin:9px 0 22px;
  color:#61788d;
  font-size:14px;
  line-height:1.6;
}
.yf-business__benefits{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:12px;
}
.yf-business__benefits div{
  border:1px solid #e2edf4;
  border-radius:14px;
  padding:16px;
  background:#fbfdff;
}
.yf-business__benefits strong{
  display:block;
  color:var(--yf-blue-dark);
  font-size:14px;
  margin-bottom:4px;
}
.yf-business__benefits span{
  color:var(--yf-muted);
  font-size:11px;
  line-height:1.45;
}
.yf-business__actions{
  display:flex;
  flex-wrap:wrap;
  gap:12px;
  margin-top:20px;
}
.yf-business__panel{
  padding:22px;
  background:linear-gradient(180deg,#f5fbff 0%,#f2faed 100%);
  display:grid;
  gap:12px;
  align-content:center;
}
.yf-business-stat{
  border:1px solid rgba(11,99,182,.14);
  border-radius:14px;
  background:#fff;
  padding:18px;
}
.yf-business-stat strong{
  display:block;
  color:var(--yf-green-dark);
  font-size:24px;
  font-weight:900;
  line-height:1;
  margin-bottom:6px;
}
.yf-business-stat span{
  color:var(--yf-muted);
  font-size:11px;
}

.yf-promo__head{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:24px;
  margin-bottom:18px;
}
.yf-text-link{
  flex:0 0 auto;
  color:var(--yf-blue);
  font-size:13px;
  font-weight:800;
  text-decoration:none!important;
}
.yf-text-link:hover{color:var(--yf-green-dark);}
.yf-promo__cards{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:14px;
}
.yf-promo-card{
  min-height:150px;
  border:1px solid #dfeaf3;
  border-radius:16px;
  padding:22px;
  background:#fff;
  text-decoration:none!important;
  display:flex;
  flex-direction:column;
  justify-content:center;
  transition:transform .16s ease, box-shadow .16s ease;
}
.yf-promo-card:hover{
  transform:translateY(-2px);
  box-shadow:0 8px 22px rgba(29,70,102,.10);
}
.yf-promo-card span{
  color:var(--yf-green-dark);
  font-size:12px;
  font-weight:800;
  margin-bottom:5px;
}
.yf-promo-card strong{
  color:var(--yf-blue-dark);
  font-size:18px;
  line-height:1.2;
  margin-bottom:6px;
}
.yf-promo-card small{
  color:var(--yf-muted);
  font-size:11px;
  line-height:1.45;
}

.yf-delivery__inner{
  border:1px solid #cfe2f1;
  border-radius:18px;
  background:linear-gradient(90deg,#f4faff 0%,#f5fbef 100%);
  padding:28px 30px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:28px;
}
.yf-delivery__message{max-width:920px;}
.yf-delivery__actions{
  flex:0 0 auto;
  display:flex;
  gap:12px;
  flex-wrap:wrap;
}
.yf-btn--whatsapp{
  background:#fff;
  color:var(--yf-green-dark);
  border-color:#8ecf72;
}
.yf-btn--whatsapp:hover{
  background:#f4fbef;
  color:#246d1a;
}
/* =========================================================
   YOGYA FRESH — FOOTER 4 COLUMN COMPACT
   Pra Go Live 2
   Scope: footer only
   ========================================================= */

.yf-footer{
  margin-top:24px;
  background:#F4F8FB;
  color:#52697D;
  border-top:1px solid #DDE7EF;
}

.yf-footer__inner{
  width:min(1500px, calc(100% - 48px));
  margin:0 auto;
  display:grid;
  grid-template-columns:minmax(300px,1.35fr) repeat(3,minmax(0,1fr));
  gap:30px;
  padding:38px 0 30px;
  box-sizing:border-box;
}

/* BRAND */

.yf-footer__brand{
  min-width:0;
}

.yf-footer__brand img{
  display:block;
  width:220px;
  max-width:100%;
  height:auto;
  margin:0 0 12px;
  background:transparent !important;
  border-radius:0 !important;
  padding:0 !important;
}

.yf-footer__brand p{
  margin:0;
  max-width:360px;
  color:#52697D !important;
  font-size:12px;
  line-height:1.6;
}

/* FOOTER COLUMNS */

.yf-footer__col{
  min-width:0;
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  gap:7px;
}

.yf-footer__col h3{
  margin:0 0 7px;
  color:#0C447A !important;
  font-size:14px;
  line-height:1.25;
  font-weight:800;
}

.yf-footer__col a{
  display:block;
  max-width:100%;
  color:#52697D !important;
  font-size:12px;
  line-height:1.45;
  text-decoration:none !important;
  transition:color .16s ease;
}

.yf-footer__col a:hover,
.yf-footer__col a:focus{
  color:#55B62D !important;
}

/* Combined Account + Help column */

.yf-footer__col--combined{
  padding-left:4px;
}

.yf-footer__col--combined a{
  line-height:1.4;
}

/* BOTTOM BAR */

.yf-footer__bottom{
  width:min(1500px, calc(100% - 48px));
  min-height:54px;
  margin:0 auto;
  padding:13px 0;
  box-sizing:border-box;
  border-top:1px solid #D8E3EC !important;

  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:20px;

  color:#52697D !important;
  font-size:11px;
  line-height:1.4;
}

.yf-footer__bottom span{
  color:#52697D !important;
}

/* =========================================================
   TABLET
   ========================================================= */

@media (max-width:1280px){

  .yf-footer__inner,
  .yf-footer__bottom{
    width:min(1200px, calc(100% - 36px));
  }

  .yf-footer__inner{
    grid-template-columns:minmax(260px,1.25fr) repeat(3,minmax(0,1fr));
    gap:24px;
    padding:34px 0 28px;
  }

  .yf-footer__brand img{
    width:205px;
  }

}

/* =========================================================
   SMALL TABLET
   ========================================================= */

@media (max-width:1024px){

  .yf-footer__inner{
    grid-template-columns:1.2fr 1fr 1fr;
    gap:24px 20px;
  }

  .yf-footer__brand{
    grid-row:span 2;
  }

  .yf-footer__col--combined{
    padding-left:0;
  }

}

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

@media (max-width:680px){

  .yf-footer{
    margin-top:18px;
  }

  .yf-footer__inner,
  .yf-footer__bottom{
    width:calc(100% - 24px);
  }

  .yf-footer__inner{
    grid-template-columns:1fr 1fr;
    gap:26px 22px;
    padding:30px 0 24px;
  }

  .yf-footer__brand{
    grid-column:1 / -1;
    grid-row:auto;
  }

  .yf-footer__brand img{
    width:190px;
    margin-bottom:10px;
  }

  .yf-footer__brand p{
    max-width:520px;
    font-size:11px;
    line-height:1.55;
  }

  .yf-footer__col{
    gap:7px;
  }

  .yf-footer__col h3{
    margin-bottom:5px;
    font-size:13px;
  }

  .yf-footer__col a{
    font-size:11px;
    line-height:1.45;
  }

  .yf-footer__bottom{
    min-height:0;
    padding:13px 0 15px;
    align-items:flex-start;
    justify-content:flex-start;
    flex-direction:column;
    gap:5px;
  }

}

/* =========================================================
   VERY SMALL MOBILE
   ========================================================= */

@media (max-width:420px){

  .yf-footer__inner{
    grid-template-columns:1fr;
    gap:22px;
  }

  .yf-footer__brand{
    grid-column:auto;
  }

  .yf-footer__col{
    width:100%;
  }

}



.yf-whatsapp-float{
  position:fixed;
  right:22px;
  bottom:22px;
  z-index:9999;
  width:56px;
  height:56px;
  border-radius:50%;
  display:grid;
  place-items:center;
  background:#25d366;
  color:#fff!important;
  text-decoration:none!important;
  box-shadow:0 10px 28px rgba(23,71,48,.28);
  font-weight:900;
  font-size:13px;
}
.yf-whatsapp-float:hover{transform:translateY(-2px);}

@media (max-width:1280px){
  .yf-business__inner,
  .yf-promo__inner,
  .yf-delivery__inner,
  .yf-footer__inner,
  .yf-footer__bottom{
    width:min(1200px, calc(100% - 36px));
  }
}
@media (max-width:1024px){
  .yf-business__inner{grid-template-columns:1fr;}
  .yf-promo__cards{grid-template-columns:1fr;}
  .yf-delivery__inner{
    align-items:flex-start;
    flex-direction:column;
  }
  .yf-footer__inner{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
}
@media (max-width:680px){
  .yf-business,
  .yf-promo,
  .yf-delivery{padding:28px 0 14px;}
  .yf-business__inner,
  .yf-promo__inner,
  .yf-delivery__inner,
  .yf-footer__inner,
  .yf-footer__bottom{
    width:calc(100% - 24px);
  }
  .yf-business__content{padding:22px 20px;}
  .yf-business__content h2,
  .yf-promo__head h2,
  .yf-delivery__message h2{font-size:26px;}
  .yf-business__benefits{grid-template-columns:1fr;}
  .yf-promo__head{
    align-items:flex-start;
    flex-direction:column;
  }
  .yf-delivery__inner{padding:22px 20px;}
  .yf-delivery__actions{width:100%;}
  .yf-delivery__actions .yf-btn{width:100%;}
  .yf-footer__inner{
    grid-template-columns:1fr;
    gap:24px;
    padding:34px 0 26px;
  }
  .yf-footer__bottom{
    min-height:72px;
    align-items:flex-start;
    justify-content:center;
    flex-direction:column;
    padding:14px 0;
  }
  .yf-whatsapp-float{
    width:52px;
    height:52px;
    right:16px;
    bottom:16px;
  }
}


/* v0.7.1 — audit corrections only: footer logo transparency + WhatsApp icon. */
.yf-footer__brand img{
  background:transparent !important;
  border-radius:0 !important;
  padding:0 !important;
}
.yf-whatsapp-float svg{
  width:30px;
  height:30px;
  fill:#fff;
  stroke:#fff;
  stroke-width:.15;
  display:block;
}


/* v0.7.2 — FOOTER COLOR ONLY.
   Layout, spacing, logo and all other sections remain unchanged. */
.yf-footer{
  background:#F4F8FB !important;
  color:#52697D !important;
  border-top:1px solid #DDE7EF;
}
.yf-footer__col h3{
  color:#0C447A !important;
}
.yf-footer__col a,
.yf-footer__brand p,
.yf-footer__bottom{
  color:#52697D !important;
}
.yf-footer__col a:hover{
  color:#55B62D !important;
}
.yf-footer__bottom{
  border-top:1px solid #D8E3EC !important;
}


/* v0.8 — navigasi seluler dan hasil audit */
.yf-mobile-toggle{display:none;width:42px;height:42px;border:1px solid #d5e3ed;border-radius:10px;background:#fff;padding:9px;cursor:pointer;}
.yf-mobile-toggle span{display:block;height:2px;margin:4px 0;border-radius:2px;background:var(--yf-blue-dark);}
.yf-mobile-menu{display:none;border-top:1px solid var(--yf-border);background:#fff;padding:8px 18px 18px;box-shadow:0 16px 30px rgba(19,60,91,.10);}
.yf-mobile-menu.is-open{display:block;}
.yf-mobile-menu > a,.yf-mobile-menu summary{display:block;padding:13px 4px;border-bottom:1px solid #edf3f7;color:var(--yf-blue-dark);text-decoration:none;font-size:14px;font-weight:800;cursor:pointer;}
.yf-mobile-menu details{margin:0;}
.yf-mobile-menu summary{list-style:none;}
.yf-mobile-menu summary::-webkit-details-marker{display:none;}
.yf-mobile-submenu{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:7px;padding:10px 0 12px;}
.yf-mobile-submenu a{padding:10px;border-radius:9px;background:#f7fbff;color:#52697D;text-decoration:none;font-size:12px;font-weight:700;}
.yf-mobile-submenu .yf-mobile-all-products{grid-column:1/-1;color:var(--yf-green-dark);background:#f4fbef;}
.yf-fallback-note{color:var(--yf-blue);font-size:10px;font-weight:800;}
@media (max-width:1024px){
  .yf-mobile-toggle{display:block;}
}
@media (max-width:680px){
  .yf-mobile-submenu{grid-template-columns:1fr;}
}


/* HP.1.1 — clean homepage area above footer by suppressing Storefront default loop/sidebar output. */
body.home #content.site-content,
body.blog #content.site-content{
  padding-top:0;
  margin-top:0;
}

body.home .yf-front-page-main,
body.blog .yf-front-page-main{
  display:none;
}

body.home #secondary,
body.home .widget-area,
body.home .site-sidebar,
body.home .secondary,
body.blog #secondary,
body.blog .widget-area,
body.blog .site-sidebar,
body.blog .secondary{
  display:none !important;
}

/* Phase 4B.1.1 — Member registration entry/navigation only. */
.yf-register-cta{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:40px;
  padding:0 15px;
  border-radius:10px;
  background:var(--yf-green);
  color:#fff!important;
  text-decoration:none!important;
  font-size:12px;
  font-weight:800;
  white-space:nowrap;
  box-shadow:0 5px 14px rgba(85,182,45,.18);
}
.yf-register-cta:hover,.yf-register-cta:focus{background:var(--yf-green-dark);color:#fff!important;}
.yf-mobile-register-link{margin-top:8px!important;border:0!important;border-radius:10px;background:var(--yf-green);color:#fff!important;text-align:center;}
.yf-mobile-register-link:hover,.yf-mobile-register-link:focus{background:var(--yf-green-dark);color:#fff!important;}
.yf-mobile-account-link{margin-top:5px;color:var(--yf-blue)!important;}
@media(max-width:1280px){.yf-register-cta{padding:0 11px;font-size:11px}.yf-actions{gap:10px;}}
@media(max-width:1024px){.yf-register-cta{display:none;}}

/* =========================================================
   READY TO LAUNCH — HOME HERO SLIDER
   Isolated to homepage hero only.
   ========================================================= */
.yf-hero--slider{position:relative;background:#eaf5fb;border-bottom:1px solid var(--yf-border);padding:0;overflow:hidden;}
.yf-hero-slider__viewport{position:relative;min-height:585px;overflow:hidden;background:#dfeef8;}
.yf-hero-slide{position:absolute;inset:0;min-height:585px;opacity:0;visibility:hidden;pointer-events:none;transition:opacity .7s ease,visibility .7s ease;}
.yf-hero-slide.is-active{opacity:1;visibility:visible;pointer-events:auto;z-index:2;}
.yf-hero-slide__media{position:absolute;inset:0;z-index:0;overflow:hidden;background:#dfeef8;}
.yf-hero-slide__media img{width:100%;height:100%;display:block;object-fit:cover;object-position:center center;transform:scaleX(-1);}
.yf-hero-slide:nth-child(2) .yf-hero-slide__media img{transform:none;object-position:center 54%;}
.yf-hero-slide__media--products img{transform:none;object-position:center center;}
.yf-hero-slide__shade{position:absolute;inset:0;z-index:1;background:linear-gradient(90deg,rgba(255,255,255,.94) 0%,rgba(255,255,255,.86) 24%,rgba(255,255,255,.50) 43%,rgba(255,255,255,.12) 62%,rgba(255,255,255,0) 78%);}
.yf-hero-slide__content{position:relative;z-index:3;width:min(1500px,calc(100% - 48px));min-height:585px;margin:0 auto;padding:62px 0 78px;display:flex;flex-direction:column;justify-content:center;align-items:flex-start;box-sizing:border-box;}
.yf-hero--slider .yf-hero__eyebrow{margin-bottom:22px;background:rgba(255,255,255,.92);border-color:#a9d990;}
.yf-hero--slider .yf-hero__title{max-width:680px;margin-bottom:18px;font-size:64px;line-height:.99;text-shadow:0 1px 0 rgba(255,255,255,.72);}
.yf-hero--slider .yf-hero__title span{color:#168b35;}
.yf-hero--slider .yf-hero__text{max-width:650px;margin-bottom:26px;color:#314e68;font-size:20px;line-height:1.55;text-shadow:0 1px 0 rgba(255,255,255,.58);}
.yf-hero--slider .yf-hero__actions{margin-bottom:22px;}
.yf-hero--slider .yf-hero__tagline{position:static;width:auto;min-height:0;border-radius:999px;margin:0;padding:10px 18px;background:rgba(255,255,255,.92);border:1px solid rgba(7,136,216,.28);box-shadow:0 8px 22px rgba(17,66,104,.10);color:#0788d8;font-size:13px;line-height:1.2;font-weight:900;letter-spacing:.02em;text-align:left;}
.yf-hero-slider__arrow{position:absolute;top:50%;z-index:8;width:46px;height:46px;margin-top:-23px;padding:0;border:1px solid rgba(18,111,154,.24);border-radius:50%;background:rgba(255,255,255,.82);color:transparent;font-size:0;line-height:1;box-shadow:0 8px 24px rgba(17,66,104,.14),inset 0 1px 0 rgba(255,255,255,.82);cursor:pointer;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);transition:background .2s ease,border-color .2s ease,box-shadow .2s ease,transform .2s ease;}
.yf-hero-slider__arrow::before{content:"";position:absolute;top:50%;left:50%;width:10px;height:10px;border-top:2px solid #075f9f;border-right:2px solid #075f9f;transition:border-color .2s ease,transform .2s ease;}
.yf-hero-slider__arrow--prev::before{transform:translate(-42%,-50%) rotate(-135deg);}
.yf-hero-slider__arrow--next::before{transform:translate(-58%,-50%) rotate(45deg);}
.yf-hero-slider__arrow:hover,.yf-hero-slider__arrow:focus-visible{background:rgba(255,255,255,.96);border-color:rgba(22,139,53,.42);box-shadow:0 10px 28px rgba(17,66,104,.18),0 0 0 3px rgba(22,139,53,.08);transform:scale(1.06);outline:none;}
.yf-hero-slider__arrow:hover::before,.yf-hero-slider__arrow:focus-visible::before{border-color:#168b35;}
.yf-hero-slider__arrow:active{transform:scale(.97);}
.yf-hero-slider__arrow--prev{left:24px;}
.yf-hero-slider__arrow--next{right:24px;}
.yf-hero-slider__dots{position:absolute;left:50%;bottom:24px;z-index:9;display:flex;gap:10px;align-items:center;transform:translateX(-50%);padding:8px 12px;border-radius:999px;background:rgba(255,255,255,.72);box-shadow:0 8px 22px rgba(17,66,104,.12);backdrop-filter:blur(4px);}
.yf-hero-slider__dots button{width:9px;height:9px;padding:0;border:0;border-radius:50%;background:#9bb8cb;cursor:pointer;transition:width .2s ease,border-radius .2s ease,background .2s ease;}
.yf-hero-slider__dots button.is-active{width:28px;border-radius:999px;background:#0788d8;}
.yf-hero-slider__dots button:focus-visible{outline:2px solid #0788d8;outline-offset:3px;}

@media (max-width:1280px){
  .yf-hero-slider__viewport,.yf-hero-slide,.yf-hero-slide__content{min-height:540px;}
  .yf-hero-slide__content{width:min(1200px,calc(100% - 80px));padding:52px 0 72px;}
  .yf-hero--slider .yf-hero__title{font-size:54px;max-width:590px;}
  .yf-hero--slider .yf-hero__text{font-size:18px;max-width:560px;}
}
@media (max-width:1024px){
  .yf-hero-slider__viewport,.yf-hero-slide,.yf-hero-slide__content{min-height:610px;}
  .yf-hero-slide__content{width:calc(100% - 84px);padding:44px 0 76px;}
  .yf-hero-slide__shade{background:linear-gradient(90deg,rgba(255,255,255,.94) 0%,rgba(255,255,255,.82) 36%,rgba(255,255,255,.42) 60%,rgba(255,255,255,.05) 82%);}
  .yf-hero--slider .yf-hero__title{font-size:46px;max-width:540px;}
  .yf-hero--slider .yf-hero__text{max-width:520px;}
  .yf-hero-slider__arrow{width:42px;height:42px;margin-top:-21px;}
  .yf-hero-slider__arrow--prev{left:14px;}.yf-hero-slider__arrow--next{right:14px;}
}
@media (max-width:680px){
  .yf-hero-slider__viewport,.yf-hero-slide,.yf-hero-slide__content{min-height:680px;}
  .yf-hero-slide__content{width:calc(100% - 34px);padding:34px 0 82px;justify-content:flex-start;}
  .yf-hero-slide__shade{background:linear-gradient(180deg,rgba(255,255,255,.94) 0%,rgba(255,255,255,.86) 42%,rgba(255,255,255,.56) 65%,rgba(255,255,255,.18) 82%,rgba(255,255,255,.04) 100%);}
  .yf-hero-slide__media img,.yf-hero-slide:nth-child(2) .yf-hero-slide__media img,.yf-hero-slide__media--products img{object-position:center center;}
  .yf-hero--slider .yf-hero__eyebrow{font-size:12px;padding:9px 12px;margin-bottom:18px;}
  .yf-hero--slider .yf-hero__title{font-size:38px;max-width:100%;}
  .yf-hero--slider .yf-hero__text{font-size:16px;max-width:100%;margin-bottom:22px;}
  .yf-hero--slider .yf-hero__actions{width:100%;flex-direction:column;align-items:stretch;}
  .yf-hero--slider .yf-hero__tagline{font-size:10px;padding:9px 12px;}
  .yf-hero-slider__arrow{top:auto;bottom:20px;width:38px;height:38px;margin:0;}
  .yf-hero-slider__arrow--prev{left:14px;}.yf-hero-slider__arrow--next{right:14px;}
  .yf-hero-slider__dots{bottom:22px;}
}
@media (prefers-reduced-motion:reduce){
  .yf-hero-slide{transition:none;}
}


/* =========================================================
 * YOGYA FRESH MOBILE COMPACT 1.0.2 — MOBILE ONLY <=680px
 * Desktop/tablet remain exactly as before.
 * ========================================================= */
.yf-mobile-search-row{display:none!important;}

@media (max-width:680px){
  .yf-mobile-search-row{
    display:block!important;
    width:100%!important;
    box-sizing:border-box!important;
    padding:8px 12px 10px!important;
    background:#fff!important;
    border-top:1px solid #edf3f7!important;
  }

  .yf-mobile-search{
    display:grid!important;
    grid-template-columns:minmax(0,1fr) 44px!important;
    width:100%!important;
    height:44px!important;
    margin:0!important;
    overflow:hidden!important;
    border:1px solid #cfdfea!important;
    border-radius:12px!important;
    background:#fff!important;
    box-shadow:0 2px 8px rgba(17,66,104,.04)!important;
  }

  .yf-mobile-search input[type="search"]{
    width:100%!important;
    min-width:0!important;
    height:42px!important;
    margin:0!important;
    padding:0 14px!important;
    border:0!important;
    outline:0!important;
    box-shadow:none!important;
    background:transparent!important;
    color:#17324d!important;
    font-size:14px!important;
  }

  .yf-mobile-search button{
    display:grid!important;
    place-items:center!important;
    width:44px!important;
    height:42px!important;
    margin:0!important;
    padding:0!important;
    border:0!important;
    background:#fff!important;
    color:#0c447a!important;
  }

  .yf-mobile-search button svg{
    width:21px!important;
    height:21px!important;
    fill:none!important;
    stroke:currentColor!important;
    stroke-width:1.8!important;
    stroke-linecap:round!important;
    stroke-linejoin:round!important;
  }

  /* Category mega menu: ONE horizontal swipe row, never 2x4. */
  body .yf-home-categories{
    padding:0 0 10px!important;
    overflow:hidden!important;
  }

  body .yf-home-categories .yf-home-shell,
  body.tax-product_cat .yf-home-shell{
    width:100%!important;
    max-width:none!important;
    margin:0!important;
  }

  body .yf-category-strip{
    display:flex!important;
    flex-wrap:nowrap!important;
    grid-template-columns:none!important;
    grid-auto-flow:unset!important;
    width:100%!important;
    max-width:none!important;
    gap:6px!important;
    margin-top:0!important;
    padding:9px 10px 10px!important;
    overflow-x:auto!important;
    overflow-y:hidden!important;
    border-radius:0!important;
    border-left:0!important;
    border-right:0!important;
    box-sizing:border-box!important;
    scroll-snap-type:x proximity!important;
    -webkit-overflow-scrolling:touch!important;
    scrollbar-width:none!important;
  }

  body .yf-category-strip::-webkit-scrollbar{display:none!important;}

  body .yf-category-pill{
    flex:0 0 82px!important;
    width:82px!important;
    min-width:82px!important;
    max-width:82px!important;
    padding:3px 1px!important;
    gap:4px!important;
    scroll-snap-align:start!important;
  }

  body .yf-category-photo{
    width:54px!important;
    height:46px!important;
  }

  body .yf-category-name{
    min-height:24px!important;
    font-size:10px!important;
    line-height:1.18!important;
    white-space:normal!important;
  }
}

/* =========================================================
 * YOGYA FRESH — HOME HERO ORIGINAL IMAGE 1.0
 * Home slider images are shown exactly as uploaded:
 * - no white/fog gradient overlay
 * - no automatic horizontal flip
 * ========================================================= */
.yf-hero-slide__shade{
    display:none !important;
    background:none !important;
}

.yf-hero-slide__media img,
.yf-hero-slide:nth-child(2) .yf-hero-slide__media img,
.yf-hero-slide__media--products img{
    transform:none !important;
    filter:none !important;
    opacity:1 !important;
    mix-blend-mode:normal !important;
}

/* =========================================================
 * YOGYA FRESH — HOME HERO MOBILE COMPACT 1.1
 * Mobile homepage slider follows the original 1720x480 ratio,
 * matching the compact behaviour used on category/sub-product heroes.
 * Desktop/tablet are not changed.
 * ========================================================= */
@media (max-width:680px){

  .yf-hero--slider{
    padding:0 !important;
    overflow:hidden !important;
  }

  .yf-hero-slider__viewport{
    position:relative !important;
    width:100% !important;
    height:auto !important;
    min-height:0 !important;
    aspect-ratio:1720 / 480 !important;
    overflow:hidden !important;
    background:transparent !important;
  }

  .yf-hero-slide{
    position:absolute !important;
    inset:0 !important;
    width:100% !important;
    height:100% !important;
    min-height:0 !important;
    overflow:hidden !important;
  }

  .yf-hero-slide__media{
    position:absolute !important;
    inset:0 !important;
    width:100% !important;
    height:100% !important;
    background:transparent !important;
  }

  .yf-hero-slide__media img,
  .yf-hero-slide:nth-child(2) .yf-hero-slide__media img,
  .yf-hero-slide__media--products img{
    display:block !important;
    width:100% !important;
    height:100% !important;
    max-width:none !important;
    object-fit:contain !important;
    object-position:center center !important;
    transform:none !important;
    filter:none !important;
    opacity:1 !important;
  }

  .yf-hero-slide__shade{
    display:none !important;
    background:none !important;
  }

  /* Keep the compact artwork visible without a tall text layer. */
  .yf-hero-slide__content{
    min-height:0 !important;
    height:100% !important;
    padding:0 !important;
  }

  /* Compact slider controls so they do not dominate the artwork. */
  .yf-hero-slider__arrow{
    top:50% !important;
    bottom:auto !important;
    width:28px !important;
    height:28px !important;
    margin-top:-14px !important;
    background:rgba(255,255,255,.82) !important;
  }

  .yf-hero-slider__arrow--prev{left:6px !important;}
  .yf-hero-slider__arrow--next{right:6px !important;}

  .yf-hero-slider__arrow::before{
    width:7px !important;
    height:7px !important;
  }

  .yf-hero-slider__dots{
    bottom:5px !important;
    gap:5px !important;
    padding:4px 7px !important;
    background:rgba(255,255,255,.72) !important;
  }

  .yf-hero-slider__dots button{
    width:6px !important;
    height:6px !important;
  }

  .yf-hero-slider__dots button.is-active{
    width:18px !important;
  }
}

/* =========================================================
 * YOGYA FRESH — MOBILE PAGE HERO COMPACT 1.0
 * Scope ONLY mobile:
 * - Jurnal
 * - Pemasok
 * - Tentang Kami
 * - Kontak Kami
 * Desktop/tablet remain untouched.
 * ========================================================= */
@media (max-width: 680px){

  .yf-journal-hero,
  .yf-supplier-hero,
  .yf-about-hero,
  .yf-contact-hero{
    display:block !important;
    width:100% !important;
    height:auto !important;
    min-height:0 !important;
    aspect-ratio:1720 / 480 !important;
    background-size:contain !important;
    background-position:center center !important;
    background-repeat:no-repeat !important;
    overflow:hidden !important;
  }

  .yf-journal-hero__inner,
  .yf-supplier-hero__inner,
  .yf-about-hero__inner,
  .yf-contact-hero__inner{
    min-height:0 !important;
    padding-top:0 !important;
    padding-bottom:0 !important;
  }

  /* Never add extra mobile overlay/effect. */
  .yf-supplier-hero::after,
  .yf-about-hero::after,
  .yf-contact-hero::after{
    display:none !important;
    content:none !important;
    background:none !important;
  }
}

