/* Телефон сохраняет бумагу, рисунки сырья и перелёт одной бутылки.
   Перекомпоновываем сцену, не масштабируем текст вместе со всем десктопом. */
@media(max-width:850px){
  html:has(.hero),body:has(.hero){overflow-x:clip}
  /* Цветок и «лужа» на высоких экранах (iPhone Pro Max) выходят за рамку блока — не обрезаем их. */
  .hero .ingredient-art,.hero .backdrop{overflow:visible}
  /* SVG-фильтры (шум + смещение + размытие, drop-shadow) Safari считает на процессоре
     и пересчитывает при каждой перерисовке первого экрана — страница подвисала до
     прокрутки. На телефоне заменяем их обычным размытием, которое считает видеокарта. */
  .botanical-plate .pigment{filter:blur(5px)}
  .botanical-plate .botanical-sprig{filter:saturate(1.16)}
  .botanical-plate .seed-detail{filter:none}
  .hero,.production-story{font-size:14px;-webkit-text-size-adjust:100%;text-size-adjust:100%}
  .home-hero-screen{display:block;min-height:0}
  body:has(.hero) .nav-header{position:absolute;left:0;right:0;top:0}
  /* Заголовок и сцена занимают экран; нижняя полоса оставлена каталогам. */
  .hero,.journey-enabled .hero{--hero-band:150px;--hero-actions:74px;--hero-bottle:min(100%,54svh,500px)}
  .hero,.journey-enabled .hero{width:calc(100% - 36px);height:100svh;min-height:560px;padding:102px 0 var(--hero-band);display:grid;grid-template-columns:minmax(0,1fr);grid-template-rows:auto minmax(0,1fr);gap:12px;align-items:stretch}
  .hero .copy{padding:0;transform:none}
  .hero .wordmark{display:none}
  .hero .hero-eyebrow-mobile{display:block;margin:0 0 12px;font-size:10px;line-height:1.3;letter-spacing:.13em;text-transform:uppercase;text-align:center;color:var(--oil-ink)}
  .hero h1{font-size:clamp(27px,8.1vw,40px);letter-spacing:-.045em;line-height:1.08;text-align:center;font-weight:500}
  .hero-title-desktop,.hero .description{display:none}
  .hero-title-mobile{display:block}.hero-title-mobile>span{color:var(--oil-ink)}
  .hero .actions{position:absolute;left:0;right:0;bottom:var(--hero-actions);z-index:4;display:grid;grid-template-columns:1fr 1fr;gap:10px}
  .hero .btn{min-width:0;min-height:46px;padding:12px 14px;font-size:13px;border-width:1px;white-space:nowrap;box-shadow:none;justify-content:space-between;gap:8px}
  .hero .catalog-arrow{display:inline;font-size:17px;font-weight:400}
  .hero .btn-secondary{border-color:color-mix(in srgb,var(--oil-ink) 42%,transparent);box-shadow:none}
  .hero .btn-secondary:hover{background:none;border-color:var(--oil-ink);transform:none}
  .hero .composition{height:100%;min-height:0;max-height:none}
  .hero #bottle,.hero .poster{inset:auto auto auto 46%;top:calc(50% - var(--hero-bottle)/2);width:56%;height:var(--hero-bottle);touch-action:pan-y pinch-zoom}
  /* Центрируется только описание. Стрелки стоят ниже и не смещают текст.
     Отступ от края держит колонку внутри пятна: у самого края экрана бок пятна
     уже ушёл вправо, и строка цены оказывалась на голом фоне.
     Касания блок не перехватывает: он заходит на левый край бутылки, а её
     крутят пальцем. Интерактивны здесь только кнопки переключателя. */
  .hero .oil-info{position:absolute;left:4%;top:50%;transform:translateY(-50%);z-index:2;display:block;width:50%;max-width:240px;--oil-control-gap:22px;pointer-events:none}
  .hero .oil-description{position:static;transform:none;width:100%;max-width:none;gap:16px;grid-template-columns:minmax(0,1fr);align-items:start}
  .hero .oil-description>*{grid-area:auto;min-height:0}
  .hero .oil-description-name{font-size:clamp(20px,6vw,27px);line-height:1.12;overflow-wrap:normal;color:#3b352b}
  .hero .oil-description .product-text{display:none}
  .hero .product-text-mobile{display:block;margin:0;font-size:14px;line-height:1.45;color:#59503d}
  .hero .oil-price-line{gap:4px 8px;flex-wrap:wrap;margin:0}
  .hero .oil-price{font-size:26px}.hero .oil-price-volume{font-size:11px}
  .hero .oil-switcher{position:absolute;left:0;top:calc(100% + var(--oil-control-gap));bottom:auto;transform:none;gap:8px;padding:0;background:none;box-shadow:none;pointer-events:auto}
  .hero .oil-step{width:44px;height:44px;min-width:44px;font-size:22px;border:1px solid #aa976753;background:#fffaf333;color:#6b592e}
  .hero .oil-counter{min-width:36px;font-size:12px;letter-spacing:0;white-space:nowrap}
  .hero .product-link{display:none}
  /* Пятно держит исходные пропорции радиусов — их подгонка под колонку текста
     вытягивала нижний левый угол в клин. Вместо этого пятно чуть шире и стоит
     по центру сцены, а описание отодвинуто от края внутрь цвета. */
  .hero .backdrop{inset:0 -18px;height:100%}
  .hero .sun{left:50%;top:50%;width:98%;height:96%;opacity:.42;border-radius:35% 65% 48% 52% / 46% 48% 52% 54%}
  /* Рисунок сырья остаётся частью сцены и меняется вместе с маслом. */
  .hero .ingredient-art{display:block;inset:0 -6px}
  /* Рисунок уведён левее и выше бутылки: на телефоне она закрывала цветок
     правой половиной, и от соцветия оставался обрезанный край. */
  .hero .botanical-plate{--plant-scale:1.4;--plant-x:-150px;--plant-y:-155px}
  .hero .plate-sunflower,.hero .plate-apricot,.hero .plate-walnut{--plant-x:-150px}
  .hero .botanical-plate .seed-detail{display:none}
  .hero .cumin-main-pod{display:none}
  .hero .cumin-bloom{display:inline}
  .hero .bottle-shadow{left:62%;width:24%;bottom:calc(50% - var(--hero-bottle)/2 + 12px)}
  .hero .ambient-seed{width:min(var(--seed-size),24px);opacity:.1}
  /* Пара семян в верхней части экрана. Скрыты только первые два: они попадают
     на саму шапку. Отступ сверху в пикселях, а не в процентах: шапка одной
     высоты на любом экране, а процент от короткого героя заводит семя под неё.
     По горизонтали разведены к краям — в середине заголовок. */
  .hero .ambient-seed:nth-child(-n+2){display:none}
  .hero .seed-2{left:90%;top:104px}.hero .seed-3{left:7%;top:168px}
  .hero .story-jump,.production-story .story-jump{position:absolute;left:0;bottom:max(16px,env(safe-area-inset-bottom));gap:14px;padding:10px 0;min-height:44px;font-size:14px;line-height:1.2;white-space:nowrap;margin:0}
  .story-jump span{font-size:20px}
  .production-story{width:calc(100% - 36px);margin:0 auto;padding:0}
  .story-board{height:100svh;min-height:560px;display:block;padding:0}
  .story-layout{display:block;position:absolute;inset:0;width:100%;height:100%;transform:none}
  .story-heading,.shelf-board .story-heading{position:absolute;left:0;top:28px;width:100%;max-width:none}
  .story-heading h2,.shelf-board .story-heading h2{font-size:clamp(28px,7.8vw,38px);line-height:1.06}
  .story-heading .story-eyebrow{font-size:10px;letter-spacing:.16em;margin-bottom:14px}
  .story-lead{font-size:clamp(17px,4.8vw,22px);line-height:1.35;margin:0}
  .storage-copy p.story-mobile-copy,.press-copy>p.story-mobile-copy{display:block;margin:10px 0 0;font-size:13px;line-height:1.45;color:var(--board-text)}
  .story-signature,.story-bottle-caption,.story-ground{display:none}
  .story-bottle-anchor{position:absolute;left:var(--bottle-x);top:var(--bottle-y);width:70%;height:var(--bottle-h);transform:translate(-50%,-50%)}
  .story-seeds{width:80px;opacity:.3}.story-seeds+.story-seeds{display:none}
  .story-facts li{grid-template-columns:18px 1fr;gap:7px;font-size:14px;line-height:1.35}
  .story-facts li>span{font-size:10px}.story-facts p{display:none}
  .storage-figure figcaption,.press-study figcaption,.value-study figcaption{display:none}

  .storage-board{--bottle-x:77%;--bottle-y:62%;--bottle-h:46svh}
  .storage-copy{position:absolute;left:0;top:22%;width:55%;max-width:none}
  .storage-copy p:not(.story-lead):not(.story-mobile-copy){display:none}
  .storage-figure{position:absolute;right:0;top:19%;width:42%;margin:0}
  .storage-figure img{height:18svh;width:100%;object-fit:contain}
  .storage-facts{position:absolute;left:0;right:auto;top:45%;bottom:auto;width:53%}
  .storage-facts li{padding:12px 0;font-size:14px}
  .storage-note{position:absolute;left:0;bottom:15%;width:52%;padding:0;border:0}
  .storage-note span{display:none}.storage-note p{font-size:13px;line-height:1.45;max-width:none}
  .storage-seeds{left:51%;top:auto;bottom:8%;width:65px}

  .press-board{--bottle-x:25%;--bottle-y:66%;--bottle-h:36svh}
  .press-study{position:absolute;left:0;top:22%;width:43%;margin:0}
  .press-study img{height:23svh;width:100%;object-fit:contain}
  .press-copy{position:absolute;right:0;top:22%;width:51%;max-width:none}
  .press-copy>p:not(.story-lead):not(.story-mobile-copy){display:none}
  .press-steps{margin:12px 0 0}.press-steps li{grid-template-columns:18px 1fr;gap:5px;padding:10px 0}
  .press-steps h3{font-size:14px;line-height:1.4}.press-steps p{display:none}
  .press-film{position:absolute;left:auto;right:0;bottom:20%;width:52%;gap:9px;padding:10px 0}
  .press-film>img{width:38px;height:62px}.press-film-kicker{display:none}
  .press-film strong{font-size:13px;line-height:1.3}.press-film small{font-size:10px;margin-top:6px}
  .press-play{width:28px;height:44px;border:0;font-size:24px}
  .press-footnote{position:absolute;right:0;bottom:12%;width:52%;font-size:11px;line-height:1.45}
  .press-seeds{left:auto;right:0;top:14%;bottom:auto;width:60px}

  .value-board{--bottle-x:78%;--bottle-y:48%;--bottle-h:42svh}
  .value-copy{position:absolute;left:0;top:23%;width:56%;max-width:none}
  .value-copy>p:not(.story-lead){display:none}
  .value-study{position:absolute;left:0;top:39%;width:48%;margin:0}
  .value-study img{height:25svh;width:100%;object-fit:contain}
  .value-facts{position:absolute;left:0;bottom:14%;width:100%;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:14px 16px}
  .value-facts li{padding-top:10px;font-size:13px}.value-seeds{right:0;top:18%;bottom:auto;width:60px}

  .shelf-board{--bottle-x:87.5%;--bottle-y:64%;--bottle-h:min(34svh,65vw);padding:0}
  .shelf-board .story-heading{max-width:90%}
  .shelf-copy{position:absolute;left:0;right:auto;top:25%;width:72%;max-width:none}
  .shelf-copy .story-lead{font-size:20px;margin-bottom:10px}
  .shelf-copy>p:not(.story-lead){font-size:13px;line-height:1.45}
  .shelf-link{min-height:44px;align-items:center;margin-top:8px;padding-bottom:0;font-size:14px}
  .shelf-seeds{left:auto;right:0;top:15%;bottom:auto;width:30%;max-width:135px;opacity:.48}
  .shelf-showcase,.shelf-row{position:absolute;inset:0;width:100%;height:100%;display:block}
  .shelf-slot{position:absolute;left:var(--slot-x);top:var(--bottle-y);width:calc(var(--bottle-h)*.44);height:var(--bottle-h);transform:translate(-50%,-50%)}
  .shelf-slot-1{--slot-x:12.5%}.shelf-slot-2{--slot-x:37.5%}.shelf-slot-3{--slot-x:62.5%}.shelf-slot-4{--slot-x:87.5%}
  .shelf-slot img{height:100%}.shelf-slot-empty{display:block}
  .shelf-slot:not(.shelf-slot-empty)::after{bottom:5%}
  .shelf-label{top:calc(100% + 8px);bottom:auto;width:23vw;min-width:0;padding-top:8px;gap:6px;white-space:normal}
  .shelf-label strong{font-size:11px;line-height:1.3;min-height:29px}.shelf-label span{font-size:10px;white-space:nowrap}
  .shelf-label .shelf-volume{display:none}
  .shelf-board .story-bottle-anchor{left:var(--bottle-x);top:var(--bottle-y);width:70%;height:var(--bottle-h)}
  .shelf-board .story-bottle-caption,.shelf-board .story-ground{display:none}

  .flour-block{height:100svh;min-height:560px;display:grid;grid-template-columns:minmax(0,1fr);grid-template-rows:auto auto minmax(0,1fr) auto;gap:14px;padding:26px 0 max(16px,env(safe-area-inset-bottom))}
  .followup-eyebrow{font-size:10px;margin-bottom:12px}.flour-block h2{font-size:28px}
  .flour-block .followup-copy{max-width:none;align-self:start}.flour-block .followup-lead{display:none}
  .flour-block .followup-copy>p{font-size:13px;line-height:1.4;margin:0 0 10px}
  .flour-block .followup-copy>p:last-of-type{margin-bottom:10px}
  .followup-button{min-height:44px;padding:10px 20px;margin:0;font-size:13px}
  .flour-grid.catalog__grid{grid-template-columns:repeat(2,minmax(0,1fr));grid-template-rows:repeat(2,minmax(0,1fr));align-self:stretch;height:100%;gap:12px;margin:0;min-height:0}
  .flour-grid .catalog-card{min-width:0;min-height:0;height:100%;align-self:stretch;display:flex;flex-direction:column;border-radius:12px}
  .flour-grid .catalog-card__image{flex:1;min-height:0;height:auto;padding:0;aspect-ratio:auto}
  .flour-grid .catalog-card__body{flex:none;padding:8px 10px;gap:0}
  .flour-grid .catalog-card__title{display:block;font-size:13px;font-weight:500;line-height:1.25;min-height:33px;text-transform:none;letter-spacing:-.01em;overflow:visible;-webkit-line-clamp:unset;text-overflow:clip}
  .flour-grid .catalog-card__tagline,.flour-grid .catalog-card__purchase{display:none}
  .flour-block .story-jump{position:static;justify-self:start;grid-column:1;margin:0}
  html:not(.journey-enabled):has(.hero){scroll-snap-type:y proximity}
  .home-hero-screen,.story-board,.flour-block{scroll-snap-align:start}
}
/* На коротком экране убираем дополнительные пояснения, не уменьшая кнопки. */
@media(max-width:850px) and (max-height:700px){
  .hero,.journey-enabled .hero{--hero-band:136px;--hero-actions:62px;--hero-bottle:min(100%,54svh,380px);gap:8px;padding-top:86px}
  .hero h1{font-size:27px}
  .hero .hero-eyebrow-mobile{margin-bottom:8px;font-size:9px}
  .hero .oil-info{--oil-control-gap:14px}
  .hero .botanical-plate{--plant-scale:1.15;--plant-y:-60px;--plant-x:-118px}
  .hero .plate-sunflower,.hero .plate-apricot,.hero .plate-walnut{--plant-x:-118px}
  .hero .oil-price{font-size:23px}
  .hero .oil-description{gap:10px}.hero .oil-description-name{font-size:18px}
  .hero .product-text-mobile{font-size:12px}
  .story-heading,.shelf-board .story-heading{top:20px}
  .story-heading .story-eyebrow{margin-bottom:10px}.story-heading h2,.shelf-board .story-heading h2{font-size:28px}
  .story-lead{font-size:17px}.story-mobile-copy{font-size:11.5px;line-height:1.35}.storage-note{display:none}.storage-facts{top:47%}.storage-facts li{padding:8px 0;font-size:13px}
  .press-steps{margin-top:12px}.press-steps li{padding:9px 0}.press-film{bottom:17%}.press-footnote{display:none}
  .value-facts{bottom:15%;gap:10px 12px}.value-facts li{font-size:12px}
  .shelf-copy{top:24%;width:73%}.shelf-copy .story-lead{font-size:17px}.shelf-copy>p:not(.story-lead){display:none}
  .shelf-board{--bottle-y:59%;--bottle-h:min(31svh,58vw)}
  .flour-block{padding-top:20px;gap:10px}.flour-block h2{font-size:25px}.followup-eyebrow{margin-bottom:8px}
  .flour-block .followup-copy>p{display:none}
}
@media(max-width:850px) and (max-height:620px){
  .storage-copy p.story-mobile-copy,.press-copy>p.story-mobile-copy{display:none}
  .storage-facts{top:43%}
  .hero .product-text-mobile{display:none}
  .value-board{--bottle-y:46%;--bottle-h:36svh}
}