/* HAZEM_SITE_RESPONSIVE_2026 */
html[data-hazem-design] body :is(
 main,.intro,.identity,.about-story,.quick-facts,.interest,
 .project,.setup-grid article,.hz-birthday-card,.hz-wallpaper
){min-width:0}
html[data-hazem-design] body :is(p,h1,h2,h3,figcaption,.link-label){
 overflow-wrap:break-word
}
html[data-hazem-design] body :is(img,video){
 max-width:100%;height:auto
}
html[data-hazem-design] body .interest>.icon{
 align-self:start!important;flex-shrink:0;aspect-ratio:1;
 height:auto!important;display:grid;place-items:center
}
html[data-hazem-design] body .hero:has(>.intro:only-child){
 grid-template-columns:minmax(0,1fr)!important
}
html[data-hazem-design] body .button{
 max-width:100%;white-space:normal
}
html[data-hazem-design] body :is(
 .hz-birthday-actions,.hz-likes-actions,.hz-owner-controls,.hz-admin-actions
){
 display:flex;flex-wrap:wrap;gap:16px;align-items:center
}
html[data-hazem-design] body .hz-likes-list{
 list-style:none;padding:0
}
html[data-hazem-design] body .hz-owner-reply{
 margin-top:20px;padding-top:16px;border-top:1px solid var(--line)
}

@media(min-width:900px){
 html[data-hazem-design] body .shell{
  width:100%!important;max-width:1360px!important;
  margin-inline:auto!important;padding-inline:40px!important
 }
 html[data-hazem-design] body .hazem-floating-topbar{
  max-width:1280px!important;left:32px!important;right:32px!important;
  padding:12px 20px!important
 }
 html[data-hazem-design] body #about.hero{
  display:grid!important;
  grid-template-columns:minmax(0,1.35fr) minmax(0,1fr)!important;
  gap:28px!important;align-items:stretch
 }
 html[data-hazem-design] body .intro{
  padding:clamp(32px,3.5vw,56px)!important
 }
 html[data-hazem-design] body #about h1{
  font-size:clamp(64px,6vw,92px)!important;line-height:1.08!important
 }
 html[data-hazem-design] body .hero-copy{
  font-size:18px;max-width:70ch;line-height:1.75
 }
 html[data-hazem-design] body .about-more{
  display:grid!important;
  grid-template-columns:minmax(0,1.2fr) minmax(0,1fr)!important;
  gap:36px!important
 }
 html[data-hazem-design] body :is(.interest-grid,.setup-grid){
  display:grid!important;
  grid-template-columns:repeat(3,minmax(0,1fr))!important;
  gap:24px!important
 }
 html[data-hazem-design] body .project-grid{
  display:grid!important;
  grid-template-columns:repeat(2,minmax(0,1fr))!important;
  gap:24px!important
 }
 html[data-hazem-design] body .interest{
  align-items:start!important;gap:16px!important
 }
 html[data-hazem-design] body .interest>.icon{
  width:52px!important;min-width:52px!important;padding:10px!important
 }
 html[data-hazem-design] body .interest :is(h3,p){
  margin-block:0 14px!important
 }
 html[data-hazem-design] body .hz-likes-list{
  display:grid!important;
  grid-template-columns:repeat(2,minmax(0,1fr))!important;
  gap:24px!important;align-items:start
 }
 html[data-hazem-design] body .hz-likes-list li{
  margin:0!important;padding:28px!important;min-width:0
 }
 html[data-hazem-design] body .hz-birthday-cards{
  grid-template-columns:repeat(2,minmax(0,1fr))!important;
  gap:28px!important
 }
 html[data-hazem-design] body .hz-wallpaper-grid{
  grid-template-columns:repeat(4,minmax(0,1fr))!important;
  gap:24px!important
 }
 html[data-hazem-design] body .hz-birthday-messages>div{
  display:grid;grid-template-columns:repeat(2,minmax(0,1fr));
  gap:24px;align-items:start
 }
 html[data-hazem-design] body .hz-birthday-messages>div>article{
  margin:0!important
 }
 html[data-hazem-design] body :is(
  .hz-admin-form,.hz-birthday-messages>form
 ){max-width:760px}
 html[data-hazem-design] body .closing{
  display:flex;justify-content:space-between;
  gap:32px;align-items:center
 }
 html[data-hazem-design] body footer{
  display:flex;flex-wrap:wrap;gap:24px;
  align-items:center;justify-content:space-between;padding-block:32px
 }
 html[data-hazem-design] body nav.bottom-nav{
  width:440px!important;max-width:calc(100% - 64px)!important;
  padding:10px!important;gap:12px!important
 }
 html[data-hazem-design] body nav.bottom-nav a{
  min-height:52px!important;min-width:64px!important
 }
 html[data-hazem-design] body #hazem-settings{
  width:min(860px,calc(100% - 80px))!important;
  max-height:calc(100dvh - 64px)!important;
  padding:32px!important;box-sizing:border-box
 }
 html[data-hazem-design] body #hazem-settings .hza-panel:not([hidden]){
  display:grid!important;
  grid-template-columns:repeat(2,minmax(0,1fr))!important;
  gap:24px!important;align-items:start
 }
 html[data-hazem-design] body #hazem-settings .hza-panel>fieldset{
  margin:0!important;min-width:0
 }
 html[data-hazem-design] body #hazem-settings .hza-tabs{
  display:flex;gap:12px;flex-wrap:wrap
 }
 html[data-hazem-design] body #hz-like-dialog{
  width:min(640px,calc(100% - 80px))!important;
  padding:32px!important
 }
 html.hz-error-ready[data-hazem-design] body#top .shell{
  max-width:920px!important;width:min(920px,100%)!important;
  padding:0!important
 }
 html.hz-error-ready[data-hazem-design] body#top #main .intro{
  padding:48px!important
 }
}

@media(min-width:1600px){
 html[data-hazem-design] body .shell{
  max-width:1520px!important;padding-inline:56px!important
 }
 html[data-hazem-design] body .hazem-floating-topbar{
  max-width:1408px!important
 }
 html[data-hazem-design] body :is(
  .interest-grid,.setup-grid,.project-grid
 ){gap:28px!important}
}

@media(min-width:600px) and (max-width:899px){
 html[data-hazem-design] body .shell{
  padding-inline:24px!important
 }
 html[data-hazem-design] body :is(
  .interest-grid,.setup-grid,.project-grid,.hz-likes-list
 ){
  display:grid!important;
  grid-template-columns:repeat(2,minmax(0,1fr))!important;
  gap:20px!important
 }
 html[data-hazem-design] body .hz-wallpaper-grid{
  grid-template-columns:repeat(2,minmax(0,1fr))!important
 }
}

@media(max-width:599px){
 html[data-hazem-design] body .shell{
  padding-inline:16px!important
 }
 html[data-hazem-design] body :is(
  .interest-grid,.setup-grid,.project-grid,.hz-likes-list,.hz-birthday-cards
 ){grid-template-columns:minmax(0,1fr)!important}
 html[data-hazem-design] body .intro{
  padding:28px 24px!important
 }
 html[data-hazem-design] body .hz-birthday h1{
  font-size:clamp(32px,10vw,48px)!important;
  letter-spacing:-1px!important;line-height:1.15!important
 }
 html[data-hazem-design] body #hazem-settings{
  max-width:calc(100% - 24px)!important;box-sizing:border-box
 }
}