:root{
  --bg:#f8f5f2;--paper:#fffdfb;--ink:#332f2d;--muted:#706b67;
  --line:#e7ded8;--soft:#f1eae5;--blue:#6688b4;--blue-dark:#4e719e;
  --blue-wash:#edf3f8;--radius:18px
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--bg);color:var(--ink);font:16px/1.55 Arial,Helvetica,sans-serif}
button,input,textarea,select{font:inherit}
button{cursor:pointer}
a{color:inherit;text-decoration:none}
img{max-width:100%}
.shell{width:min(100% - 48px,1180px);margin-inline:auto}
.top{position:sticky;top:0;z-index:40;background:rgba(248,245,242,.97);backdrop-filter:blur(14px);border-bottom:1px solid var(--line)}
.info-bar{border-bottom:1px solid var(--line);font-size:12px;color:var(--muted)}
.info-bar .shell{display:flex;justify-content:space-between;gap:16px;padding-block:8px}
.nav{min-height:77px;display:flex;align-items:center;gap:30px}
.logo{flex:none;display:flex;flex-direction:column;line-height:1;white-space:nowrap}
.logo span{font:31px/1 Georgia,"Times New Roman",serif;letter-spacing:.015em}
.logo small{font-size:10px;letter-spacing:.21em;text-transform:uppercase;color:var(--blue);margin-top:7px}
.menu{display:flex;justify-content:center;align-items:center;gap:26px;flex:1;font-size:14px}
.menu a{padding:10px 0;white-space:nowrap}
.menu a:hover,.menu a:focus-visible{color:var(--blue-dark)}
.contacts{display:flex;align-items:center;gap:17px;white-space:nowrap}
.phone{font-size:14px;font-weight:600}
.mobile-menu{display:none}
.btn{display:inline-flex;justify-content:center;align-items:center;gap:8px;border-radius:999px;border:1px solid transparent;min-height:46px;padding:11px 23px;font-size:14px;font-weight:600;line-height:1.25;text-align:center;transition:background .18s,color .18s,transform .18s}
.btn:hover{transform:translateY(-2px)}
.btn.dark{background:var(--blue);border-color:var(--blue);color:#fff}
.btn.dark:hover{background:var(--blue-dark)}
.btn.light{background:transparent;border-color:var(--blue);color:var(--blue-dark)}
.btn.light:hover{background:var(--blue-wash)}
.btn:focus-visible,button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:3px solid #9cbbdd;outline-offset:2px}
.page{display:none}.page.active{display:block}
.hero-wrap{padding:24px 0 0}
.hero{display:grid;grid-template-columns:1fr 1fr;gap:20px;align-items:stretch}
.hero-copy,.hero-photo{min-height:510px;border-radius:20px;border:1px solid var(--line);overflow:hidden}
.hero-copy{background:var(--paper);padding:clamp(38px,5vw,76px);display:flex;flex-direction:column;justify-content:center}
.hero-photo{background:url('hero.jpg') center 55%/cover no-repeat}
.kicker{font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--blue-dark);font-weight:700;margin-bottom:18px}
h1,h2,h3,p{overflow-wrap:break-word}
h1,.head h2,.block h3,.tease-copy h3,.subhero h1,.summary h2,.modal-card h2{font-family:Georgia,"Times New Roman",serif;font-weight:400}
h1{font-size:clamp(43px,4.6vw,65px);line-height:1.08;letter-spacing:-.035em;margin:0 0 24px}
h1 em{color:var(--blue);font-weight:400}
.lead{font-size:17px;line-height:1.65;color:#59534f;max-width:560px;margin:0}
.actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:30px}
.metrics{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-top:18px}
.metric{min-height:130px;padding:28px 24px;background:var(--paper);border:1px solid var(--line);border-radius:17px;display:flex;flex-direction:column;justify-content:center}
.metric b{font:29px/1.2 Georgia,serif;color:var(--blue-dark);font-weight:400}
.metric span{font-size:14px;line-height:1.35;color:var(--muted);margin-top:7px}
.section{padding:82px 0}
.section.white{background:#fffdfa}
.head{display:flex;justify-content:space-between;align-items:end;gap:24px;margin-bottom:29px}
.head h2{font-size:clamp(34px,3.3vw,47px);line-height:1.12;letter-spacing:-.025em;margin:0}
.head p{color:var(--muted);margin:9px 0 0;max-width:650px}
.link{background:none;border:0;color:var(--blue-dark);font-size:14px;font-weight:600;padding:9px 0;white-space:nowrap}
.link:hover{text-decoration:underline;text-underline-offset:5px}
.categories{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}
.cat,.work{background:var(--paper);border:1px solid var(--line);border-radius:16px;overflow:hidden}
.cat{width:100%;padding:0;text-align:left;transition:transform .2s,box-shadow .2s}
.cat:hover,.work:hover{transform:translateY(-3px);box-shadow:0 12px 28px rgba(46,40,36,.08)}
.cat img{width:100%;aspect-ratio:1.32;object-fit:cover;display:block}
.cat strong{font:21px/1.25 Georgia,serif;font-weight:400;display:block;padding:19px}
.cat strong span{float:right;color:var(--blue);font-family:Arial,sans-serif;font-size:20px}
.works{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
.work{transition:transform .2s,box-shadow .2s}
.work img{width:100%;aspect-ratio:1.22;object-fit:cover;display:block}
.work div{padding:18px 20px 20px}.work b{font:21px/1.25 Georgia,serif;font-weight:400}
.work small{color:var(--muted);font-size:13px}
.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:15px}
.step{min-height:235px;padding:28px;background:var(--paper);border:1px solid var(--line);border-radius:17px}
.num{font:37px/1 Georgia,serif;color:var(--blue)}
.step h3{font:25px/1.25 Georgia,serif;margin:24px 0 8px;font-weight:400}
.step p{margin:0;color:var(--muted)}
.tease{display:grid;grid-template-columns:37% 1fr;background:var(--blue-wash);border:1px solid #dce5ed;border-radius:20px;overflow:hidden}
.tease img{width:100%;height:100%;min-height:360px;object-fit:cover}
.tease img{grid-row:1/3}
.tease-copy{padding:clamp(30px,4.2vw,58px);align-self:center}
.tease-copy h3{font-size:clamp(34px,3vw,44px);line-height:1.15;margin:0 0 14px}
.tease-copy p{color:#55585c;max-width:560px;margin:0 0 18px}
.tease-points{grid-column:2;display:flex;flex-wrap:wrap;gap:8px;padding:0 clamp(30px,4.2vw,58px) 40px}
.tease-points div{padding:7px 12px;border-radius:99px;background:#fff;border:1px solid #d7e2ee;font-size:13px;color:#54677a}
.benefits{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}
.benefit{background:var(--paper);border:1px solid var(--line);border-radius:16px;padding:26px;min-height:176px}
.benefit b{font:22px/1.25 Georgia,serif;font-weight:400}
.benefit p{color:var(--muted);font-size:14px;line-height:1.5;margin:12px 0 0}
.faq{display:grid;grid-template-columns:1fr 1fr;gap:12px;align-items:start}
#faq{scroll-margin-top:140px}
.faq-item{background:var(--paper);border:1px solid var(--line);border-radius:13px;overflow:hidden}
.faq-item button{width:100%;background:none;border:0;display:flex;justify-content:space-between;align-items:center;gap:16px;padding:20px 22px;text-align:left;font-weight:600}
.faq-item button span{color:var(--blue);font-size:24px;line-height:1}
.faq-answer{display:none;padding:0 22px 22px;color:var(--muted);font-size:15px}
.faq-item.open .faq-answer{display:block}
.subhero{background:var(--paper);border-bottom:1px solid var(--line);padding:57px 0 54px}
.subhero h1{font-size:clamp(42px,4.2vw,58px);margin-bottom:12px}
.crumb{font-size:13px;color:var(--muted);margin-bottom:16px}
.filters,.opts,.tierbar{display:flex;gap:9px;flex-wrap:wrap}
.filters{margin-bottom:27px}
.chip,.opt{background:var(--paper);border:1px solid var(--line);border-radius:999px;padding:10px 17px;min-height:43px;font-size:14px}
.chip:hover,.opt:hover{border-color:var(--blue)}
.chip.active,.opt.sel{background:var(--blue);border-color:var(--blue);color:#fff}
.builder{display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:23px;align-items:start}
.block,.summary{background:var(--paper);border:1px solid var(--line);border-radius:18px}
.block{padding:28px;margin-bottom:16px}
.block h3{font-size:30px;line-height:1.2;margin:0 0 7px}
.block p{color:var(--muted);font-size:15px;margin:0}
.opts{margin-top:19px}.tierbar{margin:18px 0 13px}
.tier-note{font-size:14px;color:#60748b;background:var(--blue-wash);border-radius:10px;padding:13px 15px;margin-bottom:18px}
.fillings{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.fcard,.style{display:block;width:100%;padding:0;text-align:left;background:#fff;border:1px solid var(--line);border-radius:13px;overflow:hidden;transition:border-color .18s,box-shadow .18s,transform .18s}
.fcard:hover,.style:hover{transform:translateY(-2px);border-color:var(--blue)}
.fcard.sel,.style.sel{border-color:var(--blue);box-shadow:0 0 0 2px var(--blue) inset}
.fcard img{width:100%;aspect-ratio:1.3;object-fit:cover;display:block}
.ftext{padding:13px 14px 16px}
.ftext b{font:20px/1.25 Georgia,serif;display:block;min-height:50px}
.tag{font-size:11px;letter-spacing:.09em;text-transform:uppercase;color:var(--blue-dark);font-weight:700;margin-bottom:7px}
.rate{font-size:13px;color:var(--muted);margin-top:8px}
.currentprice{margin-top:9px;border-top:1px solid var(--line);padding-top:9px;color:var(--blue-dark);font-weight:700;font-size:14px}
.styles{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.style img{width:100%;aspect-ratio:1.5;object-fit:cover;display:block}
.style span{display:block;padding:13px 14px;font-size:14px}
.fields{display:grid;grid-template-columns:1fr 1fr;gap:15px}
.field{display:flex;flex-direction:column;gap:8px;font-size:14px;font-weight:600}
.field.full{grid-column:1/-1}
.field input,.field select,.field textarea{border:1px solid var(--line);background:#fff;border-radius:10px;padding:13px;min-width:0;color:var(--ink);font-size:15px;font-weight:400}
.field-hint{font-size:14px!important;margin:14px 0 0!important;color:var(--muted)}
.summary{position:sticky;top:117px;padding:22px}
.summary h2{font-size:31px;line-height:1.15;margin:0 0 5px}
.summary>small{color:var(--muted);font-size:13px}
.summary img{width:100%;height:190px;object-fit:cover;border-radius:10px;margin-top:17px}
.image-caption{color:var(--muted);font-size:12px;line-height:1.4;margin-top:5px}
.sumrow{display:flex;justify-content:space-between;gap:15px;border-bottom:1px solid var(--line);padding:10px 0;font-size:14px}
.sumrow span:first-child{color:var(--muted)}
.sumrow span:last-child{text-align:right}
.pricebox{padding:22px 0 17px}
.pricebox small{color:var(--muted);font-size:13px}
.bigprice{font:39px/1.2 Georgia,serif;color:var(--blue-dark);margin-top:3px}
.notice{font-size:13px;background:var(--blue-wash);border-radius:10px;padding:13px;color:#53677b;line-height:1.5}
.catalog-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
.catalog-grid img{width:100%;border:1px solid var(--line);border-radius:10px}
.footer{background:#34353a;color:#fff;padding:55px 0}
.footer-grid{display:grid;grid-template-columns:1.5fr 1fr 1fr;gap:30px}
.footer .brand{font:31px Georgia,serif}.footer p{font-size:14px;color:#e3e2e4}
.footer small{font-size:13px;color:#bfc6ce}
.modal{position:fixed;inset:0;background:rgba(30,30,35,.56);z-index:100;display:none;align-items:center;justify-content:center;padding:18px}
.modal.open{display:flex}
.modal-card{position:relative;background:var(--paper);border-radius:18px;padding:clamp(22px,3vw,34px);max-width:1100px;max-height:90vh;overflow:auto;width:100%}
.modal-card.small{max-width:520px}
.modal-card h2{font-size:35px;line-height:1.16;margin:0 30px 12px 0}
.modal-card p{color:var(--muted)}
.contact-actions{margin-top:18px}
.contact-actions .btn{flex:1 1 180px}
.order-fields{margin-top:18px}.order-submit{width:100%;border:0;margin-top:14px}.order-status{min-height:22px;margin-top:9px!important}.order-status.ok{color:#387445}.order-status.error{color:#a34444}.hp{position:absolute!important;left:-10000px!important;width:1px!important;height:1px!important;overflow:hidden!important}
.x{position:absolute;top:13px;right:16px;border:0;background:none;color:var(--ink);font-size:28px;line-height:1}
@media(max-width:1120px){
  .nav{gap:20px}.menu{gap:15px}.contacts .phone{display:none}
  .builder{grid-template-columns:minmax(0,1fr) 300px}
}
@media(max-width:900px){
  .info-bar{display:none}.nav{min-height:70px}.menu{display:none}.mobile-menu{display:flex;gap:24px;overflow:auto;border-top:1px solid var(--line);font-size:14px;padding:10px 0}.mobile-menu a{white-space:nowrap}
  .nav .contacts{margin-left:auto}
  .hero{grid-template-columns:1fr 1fr}.hero-copy,.hero-photo{min-height:460px}.hero-copy{padding:35px}
  .metrics,.categories,.benefits{grid-template-columns:repeat(2,minmax(0,1fr))}
  .builder{grid-template-columns:1fr}.summary{position:static}
}
@media(max-width:650px){
  .shell{width:min(100% - 32px,1180px)}.nav{min-height:64px}.logo span{font-size:26px}.logo small{font-size:9px}
  .nav .btn{padding:9px 15px;min-height:40px;font-size:12px}
  .hero-wrap{padding-top:13px}.hero{display:flex;flex-direction:column-reverse;gap:0}
  .hero-photo{min-height:300px;border-radius:17px 17px 0 0;background-position:center 59%}
  .hero-copy{min-height:unset;border-radius:0 0 17px 17px;border-top:0;padding:30px 24px 33px}
  h1{font-size:42px}.lead{font-size:16px}.actions{margin-top:23px}.actions .btn{flex:1 1 180px}
  .metrics{gap:9px;margin-top:10px}.metric{min-height:102px;padding:18px}.metric b{font-size:24px}.metric span{font-size:12px}
  .section{padding:56px 0}.head{align-items:start;flex-direction:column;margin-bottom:23px;gap:8px}.head h2{font-size:35px}
  .categories,.works,.benefits,.faq,.steps,.fillings,.styles,.catalog-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .cat strong{padding:13px;font-size:17px}.work div{padding:13px}.work b{font-size:17px}
  .steps{grid-template-columns:1fr}.step{min-height:unset}.step h3{margin-top:16px}
  .tease{display:block}.tease img{height:230px;min-height:0}.tease-copy{padding:28px 24px 10px}.tease-points{padding:10px 24px 28px}
  .benefit{min-height:160px;padding:18px}.benefit b{font-size:19px}
  .faq{grid-template-columns:1fr}.subhero{padding:38px 0}.subhero h1{font-size:42px}
  .block{padding:21px}.block h3{font-size:27px}.builder{gap:5px}
  .ftext{padding:11px}.ftext b{font-size:17px;min-height:44px}.rate,.currentprice{font-size:12px}
  .footer-grid{grid-template-columns:1fr 1fr}.footer-grid>div:first-child{grid-column:1/-1}
}
@media(max-width:390px){
  .nav .btn{display:none}.categories,.works,.benefits{grid-template-columns:1fr 1fr}
  .fields{grid-template-columns:1fr}.field.full{grid-column:auto}
  .fillings,.styles{grid-template-columns:1fr 1fr}
}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.btn,.cat,.work,.fcard,.style{transition:none}}
.catalog-grid:has(.catalog-list){display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}.catalog-list{border:1px solid #e8e0da;border-radius:16px;padding:16px;background:#fff}.catalog-list h3{margin:0 0 12px}.catalog-list div{display:flex;justify-content:space-between;gap:12px;padding:8px 0;border-bottom:1px solid #eee8e3}.catalog-list div:last-child{border:0}.catalog-list b{white-space:nowrap}@media(max-width:600px){.catalog-grid:has(.catalog-list){grid-template-columns:1fr}}

.custom-row{display:grid;grid-template-columns:1fr 1fr;gap:48px;align-items:center}.custom-row:has(> div:first-child){grid-template-columns:1fr}.custom-row img{width:100%;height:380px;object-fit:cover;border-radius:22px}.custom-row p{white-space:pre-line;margin:14px 0 23px;color:var(--muted);font-size:17px}.custom-row h2{margin:0}.menu{flex-wrap:wrap}@media(max-width:750px){.custom-row{grid-template-columns:1fr;gap:23px}.custom-row img{height:270px}}

.custom-gallery{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;margin-top:30px}.custom-gallery figure{margin:0}.custom-gallery img{width:100%;height:280px;object-fit:cover;border-radius:18px}.custom-gallery figcaption{padding:10px 3px 0;color:var(--muted);line-height:1.45}.custom-text{max-width:860px;text-align:center}.custom-text p,.custom-section > .shell > p{white-space:pre-line;margin:14px 0 23px;color:var(--muted);font-size:17px}@media(max-width:750px){.custom-gallery{grid-template-columns:repeat(2,minmax(0,1fr))}.custom-gallery img{height:180px}}